CODEWITHSUNDEEP
angularcssangular-material
Kuldeep Bhimte
Kuldeep Bhimte

Reputation: 959

Angular material button is in select state on Dialog open

I am using Angular material design. I have opened a Material Dialog, where I have a material button.

The material button is in select state when the dialog is opened

Upvotes: 2

Views: 1484

Answers (1)

bbop99
bbop99

Reputation: 1675

Without seeing some of your code, it is hard to reliably reproduce/solve your problem.

However, what I assume is causing the problem, is the autoFocus functionality that comes with the material dialog. According to the docs, it will "automatically focus on the first focusable element of the dialog".

See the referenced doc section here: https://material.angular.io/components/dialog/api#MatDialogConfig

So if that happens to be your button, it would be in a focused state when you open the dialog.

You can disable the autoFocus by passing in autoFocus: false as a config when opening the dialog.

An example of what that could look like:

this.dialog.open(YourDialogComponent, {
  autoFocus: false,
  //your other configuration
});

Hope that helps - if not, consider providing some of the dialog related code.

Upvotes: 5

Related Questions