checkbox bug fix
This commit is contained in:
parent
0794156b86
commit
515ae6f754
|
@ -25,21 +25,23 @@
|
|||
<ng-container matColumnDef="select">
|
||||
<th mat-header-cell *matHeaderCellDef>
|
||||
<mat-checkbox
|
||||
(change)="$event ? __toggleAllRows() : null"
|
||||
[checked]="selection.hasValue() && __isAllSelected()"
|
||||
[indeterminate]="
|
||||
selection.hasValue() && !__isAllSelected()
|
||||
(change)="$event ? __registToggleAllRows() : null"
|
||||
[checked]="
|
||||
registSelection.hasValue() && __registIsAllSelected()
|
||||
"
|
||||
[aria-label]="__checkboxLabel()"
|
||||
[indeterminate]="
|
||||
registSelection.hasValue() && !__registIsAllSelected()
|
||||
"
|
||||
[aria-label]="__registCheckboxLabel()"
|
||||
>
|
||||
</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(row)"
|
||||
(change)="$event ? registSelection.toggle(row) : null"
|
||||
[checked]="registSelection.isSelected(row)"
|
||||
[aria-label]="__registCheckboxLabel(row)"
|
||||
>
|
||||
</mat-checkbox>
|
||||
</td>
|
||||
|
@ -178,21 +180,23 @@
|
|||
<ng-container matColumnDef="select">
|
||||
<th mat-header-cell *matHeaderCellDef>
|
||||
<mat-checkbox
|
||||
(change)="$event ? __toggleAllRows() : null"
|
||||
[checked]="selection.hasValue() && __isAllSelected()"
|
||||
[indeterminate]="
|
||||
selection.hasValue() && !__isAllSelected()
|
||||
(change)="$event ? __removeToggleAllRows() : null"
|
||||
[checked]="
|
||||
removeSelection.hasValue() && __removeIsAllSelected()
|
||||
"
|
||||
[aria-label]="__checkboxLabel()"
|
||||
[indeterminate]="
|
||||
removeSelection.hasValue() && !__removeIsAllSelected()
|
||||
"
|
||||
[aria-label]="__removeCheckboxLabel()"
|
||||
>
|
||||
</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(row)"
|
||||
(change)="$event ? removeSelection.toggle(row) : null"
|
||||
[checked]="removeSelection.isSelected(row)"
|
||||
[aria-label]="__removeCheckboxLabel(row)"
|
||||
>
|
||||
</mat-checkbox>
|
||||
</td>
|
||||
|
|
|
@ -115,7 +115,8 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
|
|||
selectedPartnerRecommendation?: PartnerRecommendation;
|
||||
pagination?: PartnerRecommendationPagination;
|
||||
|
||||
selection = new SelectionModel<MemberModel>(true, []);
|
||||
registSelection = new SelectionModel<MemberModel>(true, []);
|
||||
removeSelection = new SelectionModel<MemberModel>(true, []);
|
||||
|
||||
private _unsubscribeAll: Subject<any> = new Subject<any>();
|
||||
|
||||
|
@ -234,30 +235,56 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
|
|||
// -----------------------------------------------------------------------------------------------------
|
||||
|
||||
/** Selects all rows if they are not all selected; otherwise clear selection. */
|
||||
__toggleAllRows() {
|
||||
if (this.__isAllSelected()) {
|
||||
this.selection.clear();
|
||||
__registToggleAllRows() {
|
||||
if (this.__registIsAllSelected()) {
|
||||
this.registSelection.clear();
|
||||
return;
|
||||
}
|
||||
|
||||
this.selection.select(...this.registPartnerStoreDataSource.data);
|
||||
this.registSelection.select(...this.registPartnerStoreDataSource.data);
|
||||
}
|
||||
|
||||
__isAllSelected() {
|
||||
const numSelected = this.selection.selected.length;
|
||||
__registIsAllSelected() {
|
||||
const numSelected = this.registSelection.selected.length;
|
||||
const numRows = this.registPartnerStoreDataSource.data.length;
|
||||
return numSelected === numRows;
|
||||
}
|
||||
|
||||
/** The label for the checkbox on the passed row */
|
||||
__checkboxLabel(row?: MemberModel): string {
|
||||
__registCheckboxLabel(row?: MemberModel): string {
|
||||
if (!row) {
|
||||
return `${this.__isAllSelected() ? 'deselect' : 'select'} all`;
|
||||
return `${this.__registIsAllSelected() ? 'deselect' : 'select'} all`;
|
||||
}
|
||||
return `${
|
||||
this.selection.isSelected(row) ? 'deselect' : 'select'
|
||||
this.registSelection.isSelected(row) ? 'deselect' : 'select'
|
||||
} row ${row.getUsername()}`;
|
||||
}
|
||||
|
||||
__removeToggleAllRows() {
|
||||
if (this.__removeIsAllSelected()) {
|
||||
this.removeSelection.clear();
|
||||
return;
|
||||
}
|
||||
|
||||
this.removeSelection.select(...this.removePartnerStoreDataSource.data);
|
||||
}
|
||||
|
||||
__removeIsAllSelected() {
|
||||
const numSelected = this.removeSelection.selected.length;
|
||||
const numRows = this.removePartnerStoreDataSource.data.length;
|
||||
return numSelected === numRows;
|
||||
}
|
||||
|
||||
/** The label for the checkbox on the passed row */
|
||||
__removeCheckboxLabel(row?: MemberModel): string {
|
||||
if (!row) {
|
||||
return `${this.__removeIsAllSelected() ? 'deselect' : 'select'} all`;
|
||||
}
|
||||
return `${
|
||||
this.removeSelection.isSelected(row) ? 'deselect' : 'select'
|
||||
} row ${row.getUsername()}`;
|
||||
}
|
||||
|
||||
/**
|
||||
* Create product
|
||||
*/
|
||||
|
|
Loading…
Reference in New Issue
Block a user