2017-02-21 36 views
1

我想第一次使用PrimeNG模板,我無法弄清楚「let-something」是如何工作的。我想我在其他的做題發現的各種組合,但所有的人都產生具有相同的錯誤:行擴展器模板不能在PrimeNG DataTable中工作

Cannot read property 'undefined' of undefined 

在我而言既不是「行」,也不是「山口」的定義。 所以我想知道let-col和其他「讓」在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> 

回答

0

我認爲你不能在rowexpansion模板使用let-COL,它應該是一個列內於一體的模板綁定

<p-column field="field_name" header="field_header"> 
     <ng-template let-col let-item="rowData" let-i="rowIndex" pTemplate="body"> 
     {{item[col.field]}}   
     </ng-template> 
    </p-column> 

然後你可以使用let-item裏面的rowexpansion模板,如:

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

它在'body'模板中工作正常,但我也需要sa我在另一個地方的'rowexpansion'模板的功能,它需要是'rowexpansions'模板,而不是'body'。 –

+0

我只需編輯answare,添加let-item選項,如果它可以解決您的問題 –