使原始 Angular 表单控件变脏

Question

Angular4 中有一个反应形式，某些控件应该在某些时候以编程方式设置。

this.form = formBuilder.group({
  foo: ''
});
...
this.form.controls.foo.setValue('foo');

如何控制 pristine/dirty 状态？目前我同时使用 form 和 foo 原始状态，例如：

<form [formGroup]="form">
  <input [formControl]="form.controls.foo">
</form>

<p *ngIf="form.controls.foo.pristine">
  {{ form.controls.foo.errors | json }}
</p>

<button [disabled]="form.pristine">Submit</button>

如果 pristine/dirty 应该仅指定人机交互并且不能以编程方式更改，那么这里哪种解决方案更可取？

Answer 1

formControl 的每个实例都有 markAsDirty() 和 markAsPristine() 方法（继承自 AbstractControl），因此，您应该能够运行

this.form.controls.foo.markAsPristine()

或更好，使用反应形式 API:

this.form.get('foo').markAsPristine()

甚至

this.form.markAsPristine()

同样可以用markAsDirty()方法完成

使原始 Angular 表单控件变脏

Make pristine Angular form control dirty

javascript

typescript

angular

angular-reactive-forms