Warum setValidators() verwenden neue Validatoren bei der nächsten Änderung und nicht sofort

Question

Zum Beispiel habe ich diesen Code, der word mit Validator für minlength 6 Zeichen initialisieren. Dann, wenn die Länge word ist> 4 minlength ist auf 8 Zeichen eingestellt.

Problem ist, dass Änderung nicht sofort sichtbar ist, wenn Sie fünftes Zeichen eingeben, aber es ist sichtbar, nachdem Sie sechstes Zeichen eingeben oder wenn Sie ein oder mehrere Zeichen löschen.

this.registerForm = this.formBuilder.group({ 
    word: [null, [Validators.required, Validators.minLength(6)] 
}, {validator: this.validateNumber}); 

validateNumber(input: AbstractControl) { 
    if(input.get("word").value != null && input.get("word").value.length > 4) { 
    input.get("word").setValidators([Validators.required, Validators.minLength(8)]); 
    } 
} 

Ich erstelle dieses Beispiel auf plunker. Wenn Sie mit der Eingabe in das Eingabefeld beginnen, gibt es einen Fehler für minlength, der sich von 6 auf 8 ändert, wenn Sie den sechsten und nicht den fünften Buchstaben eingeben.

Answer 1

Nach dem Aktualisieren der Validatoren in einem Feld müssen Sie das Steuerelement und seine Validierung aktualisieren. Andernfalls werden die Validierer nur für die Änderungen ausgeführt, die der Benutzer auf dem Formular vornimmt.

Deborah Kurata has shown it in one of its tutorials on pluralsight.

Was sollten Sie tun, ist die folgende:

validateNumber(input: AbstractControl) { 
    const wordControl = input.get("word"); 
    if(wordControl.value != null && wordControl.value.length > 4) { 
    wordControl.setValidators([Validators.required, Validators.minLength(8)]); 
    wordControl.updateValueAndValidity(); 
    } 
} 

By the way, wenn jedes Mal, wenn Sie bestätigen, können Sie die Validierer aktualisieren und die Validierung erneut ausführen, werden Sie eine Endlosschleife haben .