table 的每一行的 Angular2 唯一输入

Question

我有一个为每一行创建的输入（我正在使用 PrimeNG/datatable）。

我的问题是此输入正在获取局部变量#itsmIncident，以便可以将值传递给 "Save" 按钮。但是，对于多行，这会导致问题，有时会从不同行的文本框中获取值。

<p-column field="ITSMIncident" header="ITSM Incident" [sortable]="false" 
    [filter]="true" filterMatchMode="contains" [editable]="true" (onEdit)="editITSMIncident($event)">
    <template let-col let-row="rowData" pTemplate="editor">
        <input #itsmIncident type="text" pInputText [value]="row[col.field]" />
        <button type="button" pButton (click)="editITSMIncident(row, itsmIncident)">Save</button>
    </template>
</p-column>

Answer 1

您应该使用 [(ngModel)]，这是双向数据绑定的最佳实践

<p-column field="ITSMIncident" header="ITSM Incident" [sortable]="false" 
    [filter]="true" filterMatchMode="contains" [editable]="true" (onEdit)="editITSMIncident($event)">
    <template let-col let-row="rowData" pTemplate="editor">
        <input #itsmIncident type="text" pInputText [(ngModel)]="row[col.field]" />
        <button type="button" pButton (click)="editITSMIncident(row, itsmIncident)">Save</button>
    </template>
</p-column>

这应该强制传递特定行的数据。让我知道是否需要更多帮助

table 的每一行的 Angular2 唯一输入

Angular2 unique input for each row of a table

angular

primeng