如何使用angular2形式获得所有“脏”（修改）字段？

我无法找到如何检索用户使用angular2形式修改的所有字段。我在这里做了一些研究，并在angular2官方形式的文档，我找不到这样的信息。如何使用angular2形式获得所有“脏”（修改）字段？

这是它使用jQuery我该怎么办：

this.isFormDirty = function (form) { 
     var changeNames = []; 

     $(form).find(":input:not(:button):not([type=hidden])").each(function() { 
      if ((this.type == "text" || this.type == "textarea" || this.type == "number" || this.type == "hidden" || this.type == "file") && this.defaultValue != this.value) { 
       changeNames.push(this.name); 
      } else { 
       if ((this.type == "radio" || this.type == "checkbox") && this.defaultChecked != this.checked) { 
        changeNames.push(this.name); 
       } else { 
        if ((this.type == "select-one" || this.type == "select-multiple")) { 
         for (var x = 0; x < this.length; x++) { 
          if (this.options[x].selected != this.options[x].defaultSelected) { 
           changeNames.push(this.name); 
          } 
         } 
        } 
       } 
      } 
     }); 

     return changeNames; 
    };

有没有办法做到这一点使用angular2形式？我以为我会有某种changedValues属性，但我找不到它。

编辑

这是我的表单是如何创建的：（permissionForm的类型是FormGroup的）

this.permissionForm = this.fb.group({ 
     FullUrl: ['', Validators.required], 
     Area: ['', Validators.required], 
     Controller: ['', Validators.required], 
     Action: ['', Validators.required], 
     Name: ['', Validators.required], 
     Description: ['', Validators.required], 
     ParentPermissionId: ['', Validators.required], 
     ShowInMenu: ['', Validators.required], 
     Order: ['', Validators.required], 
     Icon: ['', Validators.required] 
    });

来源

2016-12-01 eestein

This can help http://stackoverflow.com/questions/34615425/how-to-watch-for-form-changes-in-angular-2 – Drew13

'this.permissionForm.get（'FullUrl'）。dirty' ？ – soywod

@ Drew13会调查它，谢谢:) – eestein

那么，这是如何我目前打算通过：

private getChangedProperties(): string[] { 
    let changedProperties = []; 

    Object.keys(this.permissionForm.controls).forEach((name) => { 
    let currentControl = this.permissionForm.controls[name]; 

    if (currentControl.dirty) 
     changedProperties.push(name); 
    }); 

    return changedProperties; 
}

我真的希望angular2窗体将有一个简单的属性与该信息。如果有更好的方法，请发布另一个答案。

来源

2016-12-01 18:49:02 eestein

您可以使用观测量实现这一点：

Observable.from(Object.values(this.permissionForm.controls)) 
    .filter(control => control.dirty) 
    .subscribe(control => { 
    // Here doing stuff with all your dirty control 
    })

您也可以订阅控制的变化：

this.permissionForm 
    .valueChanges 
    .subscribe(control => { 
    // Here doing stuff with your control 
    // like checking if control is dirty and append it to an array 
    });

来源

2016-12-02 11:15:49 soywod

您可以使用此辅助方法来获得一种形式的脏状态：

function getDirtyState(form: FormGroup): Object { 
    return Object.keys(form.controls).reduce<Object>((dirtyState, controlKey) => { 
    const control = form.controls[controlKey]; 

    if (!control.dirty) { 
     return dirtyState; 
    } 

    if (control instanceof FormGroup) { 
     return { 
     ...dirtyState, 
     [controlKey]: getDirtyState(control), 
     }; 
    } 

    return { 
     ...dirtyState, 
     [controlKey]: control.value, 
    }; 
    }, {}); 
}

它还处理嵌套的formGroup控件，并返回一个对象具有与整个表单相同结构的值。

来源

2017-08-25 10:26:43 Merott

如何使用angular2形式获得所有“脏”（修改）字段？

回答

相关问题