When I require two select options in a lab setting: First select: Iced drink, Hot drink. If I choose iced drink, the second select will show Black tea, green tea, coffee. If I choose hot drink, the second select will display Milk, Chocolate milk. How can I update the selectable items in the second option based on the choice made in the first option?
This is my current code:
<mat-form-field appearance="fill">
<mat-label>Select Table</mat-label>
<mat-select [(ngModel)]="selectshowedOption" (ngModelChange)="getselectedtableOption($event)" name="type">
<mat-option *ngFor="let table of options" [value]="table.name">
{{table.name}}
</mat-option>
</mat-select>
</mat-form-field>
options = [
{ name: "ICE Drink", value: 1 },
{ name: "HOT Drink", value: 2 }
]