Question

假设这个人在输入中是否包含一些信息

<input type="text" name="text" [(ngModel)]='project.text'>

如果有人需要擦除或更改数据。

如果未保存信息，如何实现一个按钮，允许您取消该字段上所有已更改的操作。

Answer 1

如果它是有角度的js，则可以使用

$setPristine();

或

$setUntouched();

另一种方法是重置运行良好的表单：

this.form.reset();

其中reset（）是内置函数，它将在需要时为您清除输入。

注意：ngModel用于角度双向绑定，因此您的组件中可能具有“ project”属性，因此，如果该值更改，您的输入将相应更改。

Answer 2

您（可能）无法撤消保存操作；以前的值已被覆盖并丢失。

但是，您可以使用一个copy变量供用户使用，直到他/她单击保存为止。

模板（使用副本）：

<input type="text" name="text" [(ngModel)]='myModelCopy.name'>

组件：

this.myModel = {
    name: 'John'
}
this.myModelCopy = {
    name: 'John'
}

// On save, replace value with copy (temporary) value.
// Use Object.assign() to make sure it's a COPY, not a reference
save(): void {
    this.myModel = Object.assign({}, this.myModelCopy);
}

// On cancel, revert to original
// Here too, use Object.assign()
cancel(): void {
    this.myModelCopy = Object.assign({}, this.myModel);
}

// On submit, update and send value
submit(): void {
    this.save();
    this.http.post(...)
}

如何实现角度取消按钮？

2 个答案: