Lors de la première entrée et de la suivante de l'utilisateur sur la page, le bouton placé n'est pas mis au point et mis en évidence par une couleur grise. J'ai essayé de définir la mise au point automatique:
<button mat-raised-button color="primary" autofocus>{{'recovery' | translate}}</button>
Je considère que c'est une imperfection des boutons de matériau.
Comment définir le bouton de matériau focalisé dans le dernier Angular?
p>
5 Réponses :
Vous pouvez utiliser la méthode focus de MatButton .
@ViewChild('button') button;
ngOnInit() {
this.button.focus()
}
<button mat-raised-button #button>{{ 'recovery' | translate }}</button>
Vous pouvez simplement définir le focus sur le bouton du hook de cycle de vie du composant ngAfterViewInit , par exemple:
...
@ViewChild('btnRef') buttonRef: MatButton;
...
ngAfterViewInit() {
this.buttonRef.focus();
}
...
<button mat-raised-button color="primary" #btnRef="matButton">{{'recovery' | translate}}</button>
J'espère que cela vous aidera.
<button mat-button #btnFocus=matButton [autofocus]="btnFocus.focus()">Post</button>
<button mat-raised-button color="primary" #btn [autofocus]="btn.focus()">{{'recovery' | translate}}</button>
veuillez expliquer un peu plus ce que le propriétaire de la question a mal fait
Veuillez ne pas publier uniquement le code comme réponse, mais également expliquer ce que fait votre code et comment il résout le problème de la question. Les réponses avec une explication sont généralement plus utiles et de meilleure qualité, et sont plus susceptibles d'attirer des votes positifs.
Il semble que le matériau angulaire ait déjà une directive pour cela. Vérifiez Angular A11y
<button mat-button cdkFocusInitial>Ok</button>