Question

我有Angular反应形式，其中每个输入都是一个单独的组件，它们以@Input()的形式接收父形式。在此组件中，我要订阅他的错误，如果有错误，请更改变量值。每个控件的错误不仅可能来自值更改，所以我无法检查模糊或值更改时的错误。正确的方法是什么？

form.html

<form [formGroup]="formName">
   <app-input-group [parentForm]="formName" [name]="controlName"></app-input-group>
</form>

input-group.ts

export class InputGroupComponent {
  @Input parentForm: FormGroup
  @Input name: string

  public status: string

  // Need to call this function when control in form have errors
  public getStatus() {
     if (this.parentForm.get(this.name).errors) {
        this.status = 'suspended'
     } else {
        this.status = 'boosted'
     }
  }
}

Answer 1

您可以在任何表单控件/组/数组上订阅statusChanges：

this.parentForm.get(this.name).statusChanges.subscribe(v => this.getStatus());

它发出所有形式的验证状态更改...

或者，您可以不同地定义状态变量：

get status() {
    return (this.parentForm.get(this.name).errors) ? 'suspended' : 'boosted';
}

但这可能不适用于您的用例。

订阅Angular反应形式的输入错误

1 个答案: