Question

我在Angular Reactive Form中有一个查询。

我在formGroup下面，在formGroup中，我有一个formArray，在formArray中，我有另一个formGroup。这是主要的formGroup

public formGroup = this.formBuilder.group({
    email: ["", Validators.required],
    address: this.formBuilder.array([
        this.initFun()
    ])
});

这是formArray initFun（）函数

fun() {
    return this.formBuilder.group({
        city: [""],
        state: [""]
    });
}

现在查询是我想要将验证器动态设置为城市和州。

在formGroup中为formArray添加动态验证器的方法是什么？

我可以使用以下语法将验证器设置为电子邮件：

this.formGroup.controls["email"].setValidators(Validators.required);

但是我无法为地址数组中的城市和州设置验证器。

任何帮助都将受到高度赞赏：）

更新

我已经创建了上述案例的示例，您可以在此处查看：https://stackblitz.com/edit/reactive-form-angular

如果我在这里做错了，请告诉我。

Answer 1

您可以遍历fb.array中的每个组，并设置所有需要的验证器：

let groupItems = this.formGroup.controls["address"].controls;

for(let item of groupItems) {
    item.controls["city"].setValidators(...);
    item.controls["state"].setValidators(...);
}

UPD ：为避免“抽象控制”类型上的“属性”控件'不存在，请使用以下作业：

let groupItems:any = (this.formGroup.get("address") as FormArray).controls;

Answer 2

你可以通过声明一个返回它的方法来尝试获取地址FormArray

get address(): FormArray {
  return this. formGroup.get("address") as FormArray;
}

之后，您可以使用at方法获取

中的特定formGroup

this.address.at(index)

之后只需将Validator分配给formControl

根据您的链接更新

您的代码看起来像

  ngOnInit() {
    this.formGroup.controls["email"].setValidators(Validators.required);
    let groupItems = this.formGroup.get("address") as FormArray;;
    groupItems
    for(let index = 0 ; index < groupItems.length; index++ ) {
        groupItems.at(index).get("city").setValidators(Validators.required);
        groupItems.at(index).get("country").setValidators(Validators.required);
    }
  }

Answer 3

感谢Anna，

以下是我上述问题的更新答案。您可以参考此链接以供参考。 https://stackblitz.com/edit/reactive-form-angular

请问我是否有任何疑问：）

无法在FormArray中设置FormGroup内的动态验证器 - Angular

3 个答案: