'select deselect all mat-select dynamic
I need to select and deselect select options from a dynamic list. If I list all select box in a loop how can i do the select deselect process for each select box independently.
import {MatOption, MatSelect} from "@angular/material";
allSelected = false;
@ViewChild('selectBox') sel: MatSelect;
constructor() {}
toggleAllSelection() {
this.allSelected = !this.allSelected;
if (this.allSelected) {
this.sel.options.forEach( (item : MatOption) => item.select());
} else {
this.sel.options.forEach( (item : MatOption) => {item.deselect()});
}
this.sel.close();
}
}
<tr *ngFor="let person of persons">
<td>
<mat-select #selectBox [formControl]="myFormControl" multiple>
<mat-option [value]="0" (click)="toggleSelection()">All</mat-option>
<mat-option *ngFor="let places of person" [value]="place">{{place.name}}
</mat-option>
</mat-select>
<td>
</tr>
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
