Question

我正在使用primeng数据表并动态生成列。我想调用方法getRowMarking(data[col.field])并向其传递一行，但它不会像那样工作。创建动态列时是否可以获得一行？原因data[col.field]不起作用。

简单数据表：

 <p-dataTable [value]="data" scrollable="true" sortMode="multiple" editable="true">
    <p-column *ngFor="let col of header" [filter]="true" [sortable]="true" [editable]="col.editable" [style]="{'width':'150px'}"
      [field]="col.field" [header]="col.field" [ngStyle]="getRowMarking(data[col.field])"></p-column>
  </p-dataTable>

Answer 1

如果要访问每列的整行，以下是使用模板实现此目的的方法：

<p-dataTable [value]="data" scrollable="true" sortMode="multiple" editable="true">
  <p-column *ngFor="let col of cols" [field]="col.field" [header]="col.header">
    <ng-template let-row="rowData" let-i="rowIndex" pTemplate="body">
      <span [ngStyle]="getRowMarking(col.field, row)">
        {{row[col.field]}}
      </span>
    </ng-template>
  </p-column>
</p-dataTable>

在getRowMarking中，您现在可以访问表格中每个单元格的列和行。

所以你可以应用条件样式：

getRowMarking(col, row) {
    if(col==='year') {
      if(row.year<=2010) {
        return {'color':'red'};
      }
      return {'color':'green'};
    }
    else if(col==='color') {
      return {'color':row.color};
    }
  }

请参阅Plunker

这就是你想要的吗？

在Primeng中动态生成colulmns时获取数据表行

1 个答案: