In the material.io examples for the button tag, I see this:-

<button mat-button disabled>Disabled</button>

The use of the disabled attribute instead of [disabled]="true" is not documented anywhere. Also, whilst it is obvious the use of the disabled attribute declares the initial state of the button to be disabled, there is no example of how to enable such a button after the initial state is set.

How do you enable a button declared with <button mat-button disabled> at runtime?

CodePudding user response：

You may refer to this Angular Property Binding

CodePudding user response：

<button mat-button disabled> is just an example to illustrate the disabled MatButton.

In order to achieve toggle behavior of disabled state, it's better to make use of Angular property binding syntax.

Coming to the below point, if one really has to disable the button by simply using the disabled attribute, and then toggle it later: This can be achieved by getting hold of the button reference within Component ts file and manually setting or removing the disabled attribute within the Component method. We can achieve this with setAttribute and removeAttribute methods.

How do you enable a button declared with <button mat-button disabled> at runtime?