En mi proyecto, es necesario usar nativeelement.value de nativeelement.value debido a algunos errores de solo lectura. solo mi directiva
export class DeliveryAcrossDirective { @Input('key') key: string; @Input('component') component: string; constructor( private store: Store, private elementRef: ElementRef<HTMLInputElement> ) { this.key = ''; this.component = ''; } @HostListener('change') onChange() { console.log('noticed something'); this.store.dispatch<IAction<IAdjust>>({ type: RDX_DELIVERY_ACROSS_ADJUST, payload: { key: this.key, value: this.elementRef.nativeElement.value }, component: this.component }) } }no captura el evento de cambio de mi mat select
<mat-form-field class="full-width" [@transformRightLeftStateTrigger]="stateDown | async"> <mat-label> {{ country | async }} </mat-label> <mat-select [formControl]="countryFormControl" appDeliveryAcross [key]="'iso'" [component]="'delivery-across'" > <mat-option *ngFor="let language of (languages | async)" [value]="language.value"> {{ language.country }} </mat-option> </mat-select> </mat-form-field>mientras que las entradas clásicas sí
<mat-form-field class="full-width" [@transformRightLeftStateTrigger]="stateDown | async"> <input matInput [formControl]="minFormControl" [errorStateMatcher]="errorStateMatcher" placeholder="Minimaal" appDeliveryAcross [key]="'min'" [component]="'delivery-across'" type="number"> </mat-form-field>¿Alguien sabe una forma de capturar el evento de cambio de un tapete seleccionado con una directiva?
No estoy seguro de qué versión de Angular Material está utilizando, pero probablemente el evento de change simple no existe para mat-select https://stackoverflow.com/a/50223943/9602452
Parece que ha modificado su directiva para mat-select s
Para detectar cambios de mat-select , no necesita HostListener , solo suscríbase a selectionChange of MatSelect
export class DeliveryAcrossDirective implements OnInit, OnDestroy { selectionSub: Subscription; constructor( private host: MatSelect ) { } ngOnInit(): void { this.selectionSub = this.host.selectionChange.subscribe(option => { console.log(option); // Do something }); } ngOnDestroy(): void { this.selectionSub?.unsubscribe(); } }