【问题标题】:Disable/Enable selection based on row content of PrimeNG TurboTable or TreeTable根据 PrimeNG TurboTable 或 TreeTable 的行内容禁用/启用选择
【发布时间】:2019-06-11 16:48:56
【问题描述】:

使用 p-treeTable 我可以根据 selectionMode = "single" 启用所有行的选择。现在我想禁用不打算选择的行的选择。

PrimeNG 7,角度 7。

如果我删除 tr 正文模板的 [ttRow]="rowNode" [ttSelectableRow]="rowNode",则所有行都无法选择。

<p-treeTable [value]="nodes" [columns]="columns" selectionMode="single" 
[(selection)]="selectedNode" dataKey="id" >

...

   <ng-template pTemplate="body" let-rowNode let-rowData="rowData" let-columns="columns">
      <tr [ttRow]="rowNode" [ttSelectableRow]="rowNode">
        <td *ngFor="let col of columns">            
          {{ rowData[col.field] }}
        </td>
      </tr>
    </ng-template>
  </p-treeTable>

现在我需要根据行数据进行检查,例如rowData.selectable', to enable/disable row selection based on the outcome ofrowData.selectable`。 任何想法如何实现这一目标?

【问题讨论】:

    标签: angular primeng-turbotable primeng-treetable


    【解决方案1】:

    我知道这是一个老问题。 但是像这样的东西怎么样:

    <tr [ttRow]="rowNode" [ttSelectableRow]="rowNode" *ngIf=rowData.selectable>
        <td *ngFor="let col of columns">            
          {{ rowData[col.field] }}
        </td>
    </tr>
    
    <tr [ttRow]="rowNode" *ngIf=!rowData.selectable>
        <td *ngFor="let col of columns">            
          {{ rowData[col.field] }}
        </td>
    </tr>
    

    【讨论】:

      【解决方案2】:

      我相信这就是 ttSelectableRowDisabled 的用途。无论如何,它似乎可以完成这项工作。

      <tr [ttRow]="rowNode" [ttSelectableRow]="rowNode" 
          [ttSelectableRowDisabled]=!rowData.selectable>
          <td *ngFor="let col of columns">            
              {{ rowData[col.field] }}
          </td>
      </tr>
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2016-09-13
        • 2018-09-19
        • 2018-09-15
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2018-07-18
        相关资源
        最近更新 更多