I'm really new with angular and I'm trying to get data from a table through checkboxes, but it only works when I click the "Select all" header. If I want to multiselect them manually it does not work . This is my .html code for my selector column.
<ng-container matColumnDef="select">
<th mat-header-cell *matHeaderCellDef> Select all
<mat-checkbox (change)="$event ? masterToggle() : null"
[checked]="selection.hasValue() && isAllSelected() "
[indeterminate]="selection.hasValue() && !isAllSelected()"
[aria-label]="checkboxLabel()">
</mat-checkbox>
</th>
<td mat-cell *matCellDef="let row">
<mat-checkbox (click)="$event.stopPropagation() "
(change)="$event ? selection.toggle(row) : null"
[checked]="selection.isSelected(row) "
[aria-label]="checkboxLabel()">
</mat-checkbox>
</td>
And this is my .ts file
isAllSelected() {
const numSelected = this.selection.selected.length;
const numRows = this.projectEntity.images.length;
return numSelected === numRows;
}
masterToggle() {
this.isAllSelected() ?
this.selection.clear() :
this.projectEntity.images.forEach(row => this.selection.select(row));
//console.log(this.imagesPlusChecked)
console.log(this.selection.selected)
}
checkboxLabel(row?: any): string {
if (!row) {
return `${this.isAllSelected() ? 'select' : 'deselect'} all`;
}
return `${this.selection.isSelected(row) ? 'deselect' : 'select'} row ${row.position + 1}`;
}
In this.selection.selected it shloud appear all my selected data. Thank you very much and sorry if this problem was already solved but I couldn't find anything.
Aucun commentaire:
Enregistrer un commentaire