How to remove auto focus on button inside angular material modal?

Question

When we place button inside angular material dialog it is auto focussing first button in that modal.

you can add "tabIndex=-1" to each button – Eliseo Feb 12 '19 at 07:53 — Eliseo, Feb 12 '19 at 07:53

Khai Kiong · Answer 1 · 2019-02-12T07:44:52.823

19

You can add the autofocus = false properties to the dialog to disable the auto focus.

Example as below:

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

edited Feb 12 '19 at 07:44

answered Feb 12 '19 at 07:30

Khai Kiong

371
2
13

The word `autofocus` in the phrase`autofocus = false` should be `autoFocus`. The letter f should be capitalized. – Duke Caesar Oct 10 '22 at 18:34

How to remove auto focus on button inside angular material modal?

1 Answers1