反应性表单-提交后，检查表单中是否至少有一项更改，然后才调用API

Question

我想要实现的是这样的：

1. 当用户单击“提交”按钮时，在后台我需要比较表单的 state 是否已更改，按 state 的意思是至少存在只需更改一次表单，然后仅，然后调用API /服务器以保存信息。
2. 如果没有任何更改，只需向用户显示一条警告消息-“嘿，您需要更新！”（console.log（）就足够了）
3. *当用户在字段1中进行某些更改时，例如从胡萝卜更改为美味的胡萝卜，然后再次更改为胡萝卜（不要调用API），我也需要处理这种情况。

此刻我有这样的东西-code example

是否可以使用原始/脏/触摸/未触摸属性来做到这一点？

Answer 1

可以使用脏检查，RxFormBuilder提供一种方法isDirty()来检查是否对formControl值进行了任何更新。您只需要从@ rxweb / reactive-form-validators包中导入FormGroupExtension和RxFormBuilder，您必须通过RxFormBuilder创建一个表单组。要检查onSubmit单击是否进行了任何更新，可以在提交按钮上单击

尝试使用此方法。

 onSubmit() {
    let isDirty = (<FormGroupExtension>this.myForm1).isDirty();
    if(isDirty)
    {
       this.http.post(this.api, this.myForm1);
    }
    else{
      console.log("Hey you need to update something!");
    }
  }

这里是分叉的Stackblitz