行扩展器模板在PrimeNG DataTable

时间:2017-02-21 08:21:35

标签: angular primeng

我第一次尝试使用PrimeNG模板而且我无法弄清楚" let-something"作品。我尝试了在其他SO问题中找到的各种组合,但它们都产生了同样的错误:

Cannot read property 'undefined' of undefined

在我的情况下," row"也不是" col"被定义为。 所以我想知道let-col和其他" let"适用于PrimeNG模板,在their site中有一个例子," let-car"但我似乎无法弄清楚那是什么" car"来自?

这是我的HTML代码:

<p-dataTable [value]="devices" expandableRows="true">
  <p-column expander="true" styleClass="col-icon"></p-column>
  <template let-col let-row="rowData" pTemplate="rowexpansion">
    <div class="ui-grid ui-grid-responsive ui-fluid" style="font-size:16px;padding:2px">
      <div class="ui-grid-row">
        <div class="ui-grid-col-9">
          <div class="ui-grid ui-grid-responsive ui-grid-pad">
            <div class="ui-grid-row">
              <div class="ui-grid-col-2 label">Vin: </div>
              <div class="ui-grid-col-10">{{row[col.field]}}</div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </template>
  <p-column *ngFor="let header of columnHeaders" [field]="header.field" [header]="header.header"></p-column>
</p-dataTable>

1 个答案:

答案 0 :(得分:0)

我认为你不能在行扩展模板中使用let-col,它应该绑定在body模板的列中

<ng-template let-item  pTemplate="rowexpansion">
{{item.field}}
</ng-template>

然后你可以在rowexpansion模板中使用let-item,例如:

    Map<String, Object> foodData = new HashMap<String, Object>();
    foodData.put("penguin", 1);
    foodData.put("flamingo", 2);
    Map<String,Object> synchronizedFoodData = Collections.synchronizedMap(foodData);
    for(String key: synchronizedFoodData.keySet())
    synchronizedFoodData.remove(key);