Home Angular material button always has a grey background anytime the modal is opened

Questions

Angular material button always has a grey background anytime the modal is opened

February 20, 2023

I have an Angular Material modal that opens, but after it opens, the Go Back button, which is a mat-button, always has a gray background. However, when I click outside the modal, it disappears. How do I remove the grey background.

>Solution :

This is Materials autoFocus property. Disable it like this:

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

autoFocus: false does the trick.

autoFocus: TRUE (default)