2016-09-30 1 views
2

primeNG 데이터 테이블을 사용하여 값을 가져옵니다. 원시 데이터 외에도 편집/삭제 작업을 추가하고 싶습니다. 문제는 필드에서 데이터를 가져 오는 방법을 알아낼 수 없다는 것입니다. 필드에서 데이터를 가져 와서 링크로 가져 오는 방법은 무엇입니까? component.ts에서primeng datatable

<p-dataTable [(value)]="pois"> 
<p-column field="value.properties.title" header="title" [filter]="true" filterMatchMode="contains" [sortable]="true"></p-column> 
<p-column field="value.properties.description" header="description" [filter]="true" filterMatchMode="contains" [sortable]="true"></p-column> 
<p-column field="value.properties.activated" header="activated" [sortable]="true"></p-column> 
<p-column field="id" header="actions"> 
    <template pTemplate> 
    <button class="btn btn-primary" [routerLink]="['/poi/edit/' + id<!--id doesnt work--> ]"><span class="icon">{{"lists.edit"|translate}}</span></button> 
    </template> 
</p-column> 

답변

1
<p-dataTable [(value)]="pois" 
    selectionMode="single" [(selection)]="selectedPois">> <---add this 

:

pois: YourType[]; 
selectedPois: YourType; 

html로에서 :

<template pTemplate> 
    <button class="btn btn-primary" [routerLink]="['/poi/edit/' + {{selectedRow.id}} ]"> 
    <span class="icon">{{"lists.edit"|translate}}</span></button> 
</template> 

이 작동해야하지만이 테스트되지 않았습니다.

+0

{{selectedRow.id}} 나던 작동합니다. "selected"변수에 접근 할 수있는 다른 방법이 있습니까? – Avocado20

4

해결책을 찾았습니다.

<p-dataTable [(value)]="pois"> 
<p-column field="value.properties.title" header="title" [filter]="true" filterMatchMode="contains" [sortable]="true"> </p-column> 
<p-column field="value.properties.description" header="description" [filter]="true" filterMatchMode="contains" [sortable]="true"></p-column> 
<p-column field="value.properties.activated" header="activated" [sortable]="true"></p-column> 
<p-column field="id" header="actions"> 
    <template pTemplate let-col let-node="rowData"> 
    <button class="btn btn-primary" [routerLink]="['/poi/edit/' + node[col.field] ]"> 
     <span class="icon">{{"lists.edit"|translate}}</span> 
    </button> 
    </template> 
</p-column>