Wie setValidators nach seiner Initialisierung FormGroup

Question

Ich habe dieses 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]}) 
}); 

und ich möchte löschen und fügen Sie Validatoren zu identityNumber abhängig von bestimmten Bedingungen in this.validateId Verfahren.

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

Wenn setValidators Methode, die ich diesen Fehler genannt wird (Zeile: 109 ist die Linie, wo setValidators genannt wird)

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) 

---

UPDATE:

I Entwicklungs-Server neu starten, und ich jetzt Erhalten Sie diesen Fehler

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) 

---

UPDATE 2:

Ich schaffe plunker einfache Fehler zu reproduzieren. Wenn Sie zuerst auf Eingabe klicken und dann irgendwo anders klicken, erhalten Sie einen Fehler darunter. Dieser Fehler sollte daher entfernt werden, wenn die Länge des Eingabewerts> = 2 ist und sollte wieder sichtbar sein, wenn> = 5. Ich weiß auch nicht, warum der Fehler verschwindet, wenn die Länge des Eingabewerts 3 ist und nicht 2 ...

Answer 1

Sie müssen bind(this), um den Kontext von this zu halten. Außerdem müssen Sie updateValueAndValidity für die Änderung der zu aktualisierenden Validatoren verwenden. Dort müssen wir auch kein Ereignis ausstrahlen, wenn Sie dies tun würden, würde dies eine Schleife durchlaufen, bis Ihr Browser abstürzt. Also folgendes ändern:

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

und der Validator würde wie folgt aussehen:

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}); 
    } 
} 

Ihre PLUNKER