Wie schreibe ich benutzerdefinierte Form Validator (modellgetrieben), die abhängig von aktuellen Eigenschaft Eigenschaft in Angular2

Question

Ich arbeite mit den neuesten angular2 Formen und kämpfen mit dieser scheinbar einfachen Aufgabe. Ich möchte eine benutzerdefinierte Validierungsfunktion haben, die in der Lage ist, die Eigenschaft der aktuellen Komponente zu lesen und die darauf basierende Eingabe zu validieren. Hier ist das Beispiel plnkr:

http://plnkr.co/edit/bNFjNsCfhYjoqKaRZgQU?p=preview

In diesem Beispiel habe ich einen Benutzernamen Feld, das immer erforderlich ist und ein Passwort-Feld, das nur benötigt werden, wenn der Kunde ein bestehendes ist.

Meine Form Erklärung ist:

this.loginForm = this.formBuilder.group({ 
    username: ["", Validators.required], 
    password: ["", this.passwordRequiredForExistingCustomer] 
}); 

Meine Validierungsfunktion ist:

passwordRequiredForExistingCustomer(control: FormControl): {[key: string]: boolean} { 
    let val = control.value; 
    if (this.state === "existingCustomer" && !val) { 
    return {"required": true}; 
    } 

    return null; 
} 

Aber ich bin nicht in der Lage auf die aktuelle Komponente in meiner Validierungsfunktion zu verweisen. Wenn Sie auf die Schaltfläche "Bestehender Kunde" klicken, wird der Fehler in der Konsole angezeigt. In diesem Fall wird die benutzerdefinierte Funktion ausgelöst und this kann nicht gefunden werden.

Fehle ich etwas? Welchen Ansatz sollte ich für diese Aufgabe wählen?

Danke,

Harry

Answer 1

Wenn passwordRequiredForExistingCustomer ein Verfahren in der aktuellen Komponente ist der Validator als Pfeil-Funktion übergeben, den Umfang der this.

this.loginForm = this.formBuilder.group({ 
    username: ["", Validators.required], 
    password: ["", (control) => this.passwordRequiredForExistingCustomer(control)] 
}); 

zu halten