angular - 将验证器添加到响应式表单时出错

Question

我创建了一个简单的表单，我想向其中添加一个验证器:

 form;

  constructor() { 
    this.form = new FormGroup({
    'old-password' : new FormControl('', [Validators.required, Validators.minLength(4)], PasswordValidators.checkPassword),
    'new-password' : new FormControl('', [Validators.required, Validators.minLength(4)]),
    'confirm-password' : new FormControl('', [Validators.required, Validators.minLength(4)])
  }, {
      validator: PasswordValidators.passwordsShouldMatch
    });
  }

但在 validator部分我收到一个错误，其中说:

[ts]
Argument of type '{ validator: (control: AbstractControl) => { passwordsShouldMatch: boolean; }; }' is not assignable to parameter of type 'ValidatorFn'.
  Object literal may only specify known properties, and 'validator' does not exist in type 'ValidatorFn'.
(property) validator: (control: AbstractControl) => {
    passwordsShouldMatch: boolean;
}

当我将表单的构造更改为 FormBuilder 时它开始工作 - 为什么？

Answer 1

根据api documentation and example构造函数只是获取验证器函数，而不是像 FormBuilder 那样的对象做。

所以这应该有效:

constructor() { 
  this.form = new FormGroup({
    'old-password' : new FormControl('', [Validators.required, Validators.minLength(4)], PasswordValidators.checkPassword),
    'new-password' : new FormControl('', [Validators.required, Validators.minLength(4)]),
    'confirm-password' : new FormControl('', [Validators.required, Validators.minLength(4)])
  },
  PasswordValidators.passwordsShouldMatch
  );
}