0

我正在使用 Angular 4 在FormArray作为数组的项目上以反应形式创建自定义验证器。它适用于初始加载，但是如果我将一个项目添加到数组中然后删除该项目，则Validator.required验证不会设置。

FromArray -> FormGroup

let customItemsValidator: Array<any> = item.selectType === 'custom' && item.required ? 
                                       [Validators.required] : [];

return this.formBuilder.group({
   customItems: [[], customItemsValidator],
})

主组件.ts 上的主窗体

this.appForm = this.formBuilder.group({
   option: this.formBuilder.array([]),
   items: this.formBuilder.array([])
});

所以我可以构建表单并且它可以 100% 工作，我有一个提交按钮，如果表单无效并且在初始加载时该按钮保持禁用状态，直到我向customItems属性添加项目。一旦我删除了添加的项目，提交按钮仍然启用，即使现在它应该被禁用，因为它是必需的并且没有价值。

移除方法

selectOptionsCustomRemove(customItem, customIdx: number, idx: number) {
  pullAt(this.items.at(idx).get('customItems').value, customIdx);
}

因此它会删除该项目，但表单上的有效性不会改变。

我已经尝试过，updateValueAndValidity()但这pullAt似乎不起作用。

4

1 回答 1

0

结果是，当我从数组中删除该项目时，它只留下了一个空[]，因为pullAt刚刚从索引中删除，这使属性的值为[]. 所以我必须将数组分配给null以便触发验证。

if (this.options.at(idx).get('customItems').value.length === 0) { 
        this.options.at(idx).patchValue({ customItems: null }) 
}
于 2017-08-08T18:31:00.303 回答