Angular2 - Formulare Benutzerdefinierte Validierung - Stellen Sie eine Referenz außerhalb der Validierungsfunktion()

Question

Ich erstelle meine eigene Validierung für ein bestimmtes FormControl, aber ich kann nicht herausfinden, wie Sie einen externen Wert außerhalb meiner Validierungsfunktion definiert.

Code:

@Component({ 
     selector: 'city-autocomplete', 
     template: ` 
    <label for="incidade">Cidade/Comarca:</label> 
    <input type="text" class="autocomplete-imput" id="incidade" 
     [formControl]=inputcidade 
     > 
    `, 
     styleUrls: ['./city-autocomplete.component.scss'] 
    }) 

    export class CityAutocompleteComponent { 

    extenalValue :boolean = false 



    inputcity = new FormControl('', [this.cityValidator]); 

    //My Validator: 
     cityValidator(ctrl: AbstractControl) { 

     const isValid = this.extenalValue // <== this is UNDEFINED 

     return isValid ? null : { 
      cityValidator: { 
      valid: false 
      } 
     } 
     } 
    } 

HTML:

ERROR:

Es ist zeigt extenalValue nicht definiert ist.

Wie ich sehen konnte, läuft Abstract Control VOR @Component, so dass ich nichts außerhalb der Validator-Funktion definieren kann.

meine Frage:

Wie soll ich Bezug auf Werte außerhalb dieser Funktion machen?

Danke.

Answer 1

Die Referenzbindung an die Komponentenklasse ist weg, wenn eine Funktionsreferenz verwendet wird.

Es gibt eine verschiedene Möglichkeiten, dies zu beheben, ist eine Option ist:

inputcity = new FormControl('', [this.cityValidator.bind(this)]); 

Eine kleine Randnotiz. Was macht eine Validator-Funktion innerhalb einer Komponente?