primeng 多选模式：如何根据条件应用条件以禁用复选框答案

【问题标题】：primeng multiselection mode : how to apply condition to disable checkbox based on conditionprimeng 多选模式：如何根据条件应用条件以禁用复选框
【发布时间】：2017-06-29 06:44:28
【问题描述】：

<p-column header="Actions" selectionMode="multiple" [style]="{'width':'40px'}" ></p-column>

我在上面添加了导致我的启动数据表中的多选模式的行。但我想禁用某些复选框取决于条件。如何处理？我尝试使用 [rowstyleclass] 进行相同的操作，但它存在性能问题，因为每次我将鼠标悬停在特定行上时都会调用它。有什么解决办法吗？

【问题讨论】：

标签： angular angular2-template primeng primeng-datatable

【解决方案1】：

您可以使用templating 来实现这一点。只需根据您在模板中的条件禁用复选框，就可以了。

【讨论】：

我尝试使用模板来实现，但它不起作用
这是唯一的解决方案，我已经在我的一个项目中使用了它，所以你也可以这样做！
不抱歉，这是一个旧项目，但我记得只是使用 *ngIf="myCondition" 隐藏它

【解决方案2】：

您可以使用列模板来实现这一点。这是示例代码。

这里所有偶数行都被逻辑禁用 - [disabled]="item.Id%2 == 0" ，您可以将所需的逻辑放在适当的位置。

你的.component.html

<p-dataTable #dt [value]="persons">
 <p-column field="" header="Select" [style]="{'width':'60px', 'align-items':'center'}">
   <ng-template let-col let-item="rowData" pTemplate="body">
      <p-checkbox [disabled]="item.Id%2 == 0" 
                  [style]="{'align':'center'}" 
                  name="persongroup" 
                  [value]="item" 
                  [(ngModel)]="selectedPersons">
      </p-checkbox>
   </ng-template>
 </p-column>
 <p-column field="Id" header="Id"></p-column>
 <p-column field="Name" header="Name"></p-column>
</p-datatable>

你的.component.ts

persons : Person[] = [
                        {'Id' : 1, 'Name' :     'person1'},
                        {'Id' : 2, 'Name' :     'person2'}
                     ];
selectedPersons : Person[]=[];

【讨论】：

对于其他人不要忘记在 app.module NgModule 导入中添加 CheckBoxModule。