Angular 2
Angular2 Anpassade valideringar

parametrar

Anpassade valideringsexempel:

Angular 2 har två typer av anpassade validerare. Synkrona validerare som i det första exemplet som körs direkt på klienten och asynkrona validerare (det andra exemplet) som du kan använda för att ringa en fjärrtjänst för att utföra valideringen för dig. I det här exemplet bör validatorn ringa servern för att se om ett värde är unikt.

export class CustomValidators {

static cannotContainSpace(control: Control) {
    if (control.value.indexOf(' ') >= 0)
        return { cannotContainSpace: true };

    return null;
}

static shouldBeUnique(control: Control) {
    return new Promise((resolve, reject) => {
        // Fake a remote validator.
        setTimeout(function () {
            if (control.value == "exisitingUser")
                resolve({ shouldBeUnique: true });
            else
                resolve(null);
        }, 1000);
    });
}}

Om ditt kontrollvärde är giltigt returnerar du helt enkelt noll till den som ringer. Annars kan du returnera ett objekt som beskriver felet.

Använda validatorer i Formbuilder

   constructor(fb: FormBuilder) {
    this.form = fb.group({
        firstInput: ['', Validators.compose([Validators.required, CustomValidators.cannotContainSpace]), CustomValidators.shouldBeUnique],
        secondInput: ['', Validators.required]
    });
}

Här använder vi FormBuilder för att skapa en mycket grundläggande form med två inmatningsrutor. FromBuilder tar en matris med tre argument för varje ingångskontroll.

1. Standardvärdet för kontrollen.
2. De validerare som kommer att köras på klienten. Du kan använda Validators.compose ([arrayOfValidators]) för att tillämpa flera validerare på din kontroll.
3. En eller flera async-validerare på liknande sätt som det andra argumentet.

get / set formBuilder kontrollerar parametrar

Det finns två sätt att ställa in parametrar för formBuilder-kontroller.

1. Initiera:

exampleForm : FormGroup;
constructor(fb: FormBuilder){
  this.exampleForm = fb.group({
      name : new FormControl({value: 'default name'}, Validators.compose([Validators.required, Validators.maxLength(15)]))
   });
}

2.After initiera:

this.exampleForm.controls['name'].setValue('default name');

Få kontrollvärde för formBuilder:

let name = this.exampleForm.controls['name'].value();