У меня есть два пункта меню Удалить и Создать под значком меню. Я выбираю любую операцию из значка меню, которая открывает диалоговое окно подтверждения с двумя кнопками Удалить и Отмена.
Первоначально фокус остается на значке меню после выбора любого пункта меню из меню. Я хочу сместить фокус на кнопку диалога по умолчанию, чтобы при нажатии Enter-Key диалоговое окно закрывалось после выполнения нужной операции. Пожалуйста, проверьте демо здесь Stackblitz< /а>
Я исправил эту проблему, поскольку Spinner не позволял фокусу перемещаться на кнопку диалога всякий раз, когда я пытался нажать «Удалить из меню». Я добавил id="deletebutton" в html, как показано ниже.
<div *ngIf="!loadspinner">
<mat-dialog-content>
<p>Are you sure to delete this?</p>
</mat-dialog-content>
<mat-dialog-actions align="center">
<button id="deletebutton" mat-raised-button color="primary" (click)="deleteDocument()">Delete</button>
<button mat-raised-button mat-dialog-close tabindex="-1" (click)="close()" style="border-color:#3f51b5;">Cancel</button>
</mat-dialog-actions>
</div>
И добавлен timeout в метод ngOnInit в файле .ts, как показано ниже.
ngOnInit() {
this.service.validate(this.data).subscribe(value => {
this.loadspinner = false;
if (value != null) {
this.warningMsg = value.statusMessage;
} else {
this.warningMsg = "";
}
//For autoFocus in dialog button as Spinner prevents it to set by deafault
setTimeout(()=>{
document.getElementById('deletebutton').focus();
});
});
}
