如何在初始化之后将validators构成组

Question

我有这个formgroup

defaultIdNumberValidator = [Validators.required, Validators.minLength(6),
    Validators.maxLength(11)];
this.registerForm = this.formBuilder.group({ 
  permissions: this.formBuilder.group({
    country: ['', [Validators.required]],
    identityNumber: [null, this.defaultIdNumberValidator],
  }, {validator: [this.validateId]}) 
});

我想清除并根据this.validateId方法中的某些条件将验证器添加到identityNumber。

validateId(input: AbstractControl) {
  if(condition) {
    input.get("identityNumber").clearValidators(); //this is working
  }
  if(condition) {
    input.get("identityNumber").setValidators(this.defaultIdNumberValidator); //not working
  }
}

当setValidators方法称为i时获得此错误（行：109是 setValidators的行）

）

ERROR TypeError: Cannot read property 'defaultIdNumberValidator' of undefined
    at RegisterComponent.validateId (register.component.ts:109)
    at eval (forms.js:742)
    at Array.map (<anonymous>)
    at _executeValidators (forms.js:742)
    at eval (forms.js:694)
    at eval (forms.js:742)
    at Array.map (<anonymous>)
    at _executeValidators (forms.js:742)
    at eval (forms.js:694)
    at eval (forms.js:742)

---

更新：

我重新启动开发服务器，现在我得到此错误

ERROR TypeError: Cannot read property 'setValidators' of undefined
at RegisterComponent.validateId (register.component.ts:109)
at eval (forms.js:742)
at Array.map (<anonymous>)
at _executeValidators (forms.js:742)
at eval (forms.js:694)
at eval (forms.js:742)
at Array.map (<anonymous>)
at _executeValidators (forms.js:742)
at eval (forms.js:694)

---

更新2：

我创建简单的plunker来重现错误。如果您首先单击输入并单击其他地方，则会在其下获得错误。因此，当输入值的长度为> = 2时，应删除此错误，并且在IS> = 5时应再次可见。我也不知道为什么当输入值的长度为3而不是2 .../p>

Answer 1

您需要bind(this)保持this的上下文。此外，您还需要使用updateValueAndValidity来更改要更新的验证器。在那里，我们还需要不发出活动，如果您是，这将循环循环，直到您的浏览器崩溃为止。因此，更改以下内容：

}, {validator: this.validateId.bind(this)}) 

，验证器看起来像这样：

validateId(input: AbstractControl) {
  // ...
  if(...) {
    input.get("identityNumber").clearValidators();
    input.get("identityNumber").updateValueAndValidity({emitEvent:false, onlySelf:true});
  }
  if(...) {
    input.get("identityNumber").setValidators(this.defaultIdNumberValidator);
    input.get("identityNumber").updateValueAndValidity({emitEvent:false, onlySelf:true});
  }
}

您的 plunker