angular 一览数据全选符合条件数据
画面效果:
解决方法:
template:
<p-table [value]="cars" [columns]="cols" [(selection)]="selectedRows"> <ng-template pTemplate="header" let-columns> <tr> <th> <p-checkbox (click)="selectRow(e.checked)" #e></p-checkbox> </th> <th *ngFor="let col of columns"> {{col.header}} </th> </tr> </ng-template> <ng-template pTemplate="body" let-rowData let-columns="columns"> <tr [pSelectableRow]="rowData"> <td> <p-tableCheckbox [value]="rowData" [disabled]="rowData.year > 2000"> </p-tableCheckbox> </td> <td *ngFor="let col of columns"> {{rowData[col.field]}} </td> </tr> </ng-template> </p-table>
component:
selectRow(checkValue) {
if (checkValue) {
this.selectedRows = this.cars.filter(value => value.year < 2000);
} else {
this.selectedRows = [];
}
}