Tengo este campo en mi forma reactiva que está presente dentro de un matDialog
<mat-form-field class="w-full" *ngIf="formType == 'da_banker'" > <mat-select value="" (selectionChange)=" onTxnStatusChange($event.value) " formControlName="txn_status_banker" name="txn_status_banker" #setFocus > <mat-option value="" >Select Transaction Status</mat-option > <mat-option value="{{ row.value }}" *ngFor="let row of txnUpdateOptions" [ngClass]=" row.name == 'Pending' ? 'hidden' : '' " >{{ row.name }}</mat-option > </mat-select> <mat-error *ngIf="showTxnStatusError" >Required</mat-error > </mat-form-field>Estoy enfocando este campo cuando la vista se inicializa usando
@ViewChild('setFocus') setFocus:ElementRef; ngAfterViewInit(): void { this.setFocus['_elementRef'].nativeElement.focus(); }funciona bien, pero cuando envío el formulario, no lo cierro porque tengo que volver a llenarlo para los siguientes datos. Para esto, quiero enfocar el mismo campo nuevamente y para esto estoy usando este código después de hacer clic en el botón Enviar
updateTxnStatus() { if(this.form.invalid == true){ return; } this.setFocus['_elementRef'].nativeElement.focus(); console.log(this.setFocus['_focused']); console.log(this.setFocus); console.log(document.activeElement) this.form.controls['txn_status_banker'].setValue(''); }En la consola, el elemento enfocado activo es exactamente lo que quiero, pero a la vista no se está enfocando.
Su focus() puede fallar si this.form.invalid es verdadero o los cambios en el formulario borran el enfoque. Mueva .focus() al final del bloque, asegúrese de que focus() esté activado.