Question

我正在使用Angular 4，并且正在使用primgng inputtext和dataTable。我的页面显示了一个带有键及其值的表，我的要求是，当我单击edit按钮时，value中的dataTable字段将开始出现在文本字段中。当我cancel时，它应撤消所有操作并显示文本字段的原始值，当我单击“保存”时，将进行服务调用以保存它。

我已经Save做完了，但是cancel我不知道该如何前进。谁能指导我如何实现取消按钮功能？

<button>Edit</button>
<button>Cancel</button>
<button>Save</button>

<p-dataTable [value]="fileInfo" [sortField]="sortF" [sortOrder]="sortO" (onSort)="changeSort($event)">
    <p-column field="key" header="Vin" [sortable]="true"></p-column>
    <p-column field="value" header="Year" [sortable]="true">
    <ng-template let-col let-item="rowData">
            <input id="float-input" type="text" size="30" pInputText value-"{{item.value}}">
        </ng-template>
    </p-column>
    <p-footer>
      <button type="button" label="Sort by Year" (click)="changeSort($event)" pButton></button>
    </p-footer>
</p-dataTable>

this.fileInfo = [{
    key: "Name",
    value: "ABC"
},
{
    key: "Age",
    value: "45"
},
{
    key: "Place",
    value: "NY"
},
{
    key: "Book",
    value: "A1"
},
{
    key: "Contact",
    value: "123456"
}

]

Answer 1

当您subscribing然后在success store it in a variable上（或者您可以根据需要将其存储在两个或多个变量中）时，除非您自行更改或重新刷新页面，否则此变量将存储数据。。因此，当您click on cancel assign the data stored in the variable to datatable.

Primeng输入文本：取消按钮功能

1 个答案: