This is my mat-button:
<button class="example-20-width" mat-raised-button disabled>Edit Client</button>
How can I control it and make it disabled or not based on whether a select form is emtry or not?
Here is my field form:
<mat-form-field class="example-full-width">
<mat-select placeholder="Select customer">
<mat-option *ngFor="let food of books.data"
[value]="food.company">
{{food.company}}
</mat-option>
<mat-option>
</mat-option>
</mat-select>
</mat-form-field>
If you look at Angular Material Demos (button), which is an older version of Angular Material demo, there is a button performing this.
This demo used to correspond (it's now outdated) to the demo on the Angular GitHub page, see: github.com - Angular Material - src/demo-app/button.
You can simply use:
<button mat-button [disabled]="isDisabled">
where isDisabled is a boolean define in your component.
use [disabled] atttribute with button
<button class="example-20-width" [disabled]="true" mat-raised-button disabled>Edit Client</button>
Use [disabled] attribute
ts file
review_btn=true;
html file
<button mat-raised-button [disabled]="review_btn" color="primary" mat-button (click)="reviewCreate()">Save</button>