web-dev-qa-db-ja.com

ダイアログのオートフォーカスを無効にする-Angular 2 / material in modal

angular material-2。のダイアログを使用しています。

問題は、特にiPhoneまたはタブレットでmodal-dialogを開いているときにオートフォーカスを無効にできないことです。 iOSでは、ダイアログ内の最初の入力フィールドに自動的にフォーカスします！

私はタブインデックスで試してみましたが、他の入力フィールドでオートフォーカスを使用すると動作しません

私はコードでAngular 2を使用しています。ダイアログではform-controlを使用しています。markasuntouchedafterviewInitを使用しようとしましたが、それでも同じ問題があります!!

angularmodal-dialogangular-material2
30
Mohamad Arbash

@angular/[email protected]MatDialogConfigには特別なオプションautoFocusがあります

/** Whether the dialog should focus the first focusable element on open. */
autoFocus?: boolean = true;

したがって、次のように使用できます。

let dialogRef = this.dialog.open(DialogOverviewExampleDialog, {
  width: '250px',
  data: { name: this.name, animal: this.animal },
  autoFocus: false   <============================== this line
});

Stackblitzの例

58
yurzui