Question

我的heroForm包含表单数组entities。每个项目都是FormGroup。

以下是示例：

this.heroForm = this.fb.group({
      entities: this.fb.array([]),
    });

以下是我将新组添加到数组的方法：

  addEntity() {
    this.entities.push(this.createFormGroup(new Address()));
  }

以下是我创建单个群组的方式：

  createFormGroup(address: Address) {
    return this.fb.group({
      'street': new FormControl(address.street, []),
      'city': new FormControl(address.city, [duplicateCity]),
      'state': new FormControl(address.state, []),
      'zip': new FormControl(address.zip, [])
    });
  }

这是自定义验证功能：

function duplicateCity(input: FormControl): any {
  if (!input.root || !(<FormGroup>input.root).controls) {
    return null;
  }

  // Do some validation.
  input.value === ...
}

现在我想迭代City通过控件并比较它们的值。如果我发现城市名称发生两次我想返回错误。

问题是我不想比较相同的控件，我想跳过它。应该准确的方法是什么？

Answer 1

其实我错过了这部分：

function duplicateCity(id: number): any {
  return (control: AbstractControl): { [key: string]: any } => {
    if (!control.root || !(<FormGroup>control.root).controls) {
      return null;
    }

    // Do some logic

  };

函数duplicateCity(id: number)现在是工厂，它返回验证功能。我可以在创建表单组期间动态地将ID作为参数传递，如下例所示：

createFormGroup(address: Address, id: number) {
    return this.fb.group({
      'street': new FormControl(address.street, []),
      'city': new FormControl(address.city, [duplicateCity(id)]),
      'state': new FormControl(address.state, []),
      'zip': new FormControl(address.zip, [])
    });

使用反应形式的不同根控件进行自定义验证

1 个答案: