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 = [];
        }
    }

 

posted @ 2020-08-14 17:44  一个小bu⑥  阅读(228)  评论(0编辑  收藏  举报