Валидатор FormControl всегда недействителен

Question

Следуя моему предыдущему вопросу , я пытаюсь создать собственный валидатор, который позволяет пользователям вводить только определенные c значения при вводе текста.

app.component .ts:

export class AppComponent implements OnInit {
  myForm: FormGroup;
  allowedValuesArray = ['Foo', 'Boo'];

  ngOnInit() {
    this.myForm = new FormGroup({
      'foo': new FormControl(null, [this.allowedValues.bind(this)])
    });        
  }

  allowedValues(control: FormControl): {[s: string]: boolean} {
    if (this.allowedValuesArray.indexOf(control.value)) {
      return {'notValidFoo': true};
    }        
    return {'notValidFoo': false};
  }
}

app.component. html:

<form [formGroup]="myForm">
  Foo: <input type="text" formControlName="foo">
  <span *ngIf="!myForm.get('foo').valid">Not valid foo</span>
</form>

Проблема в том, что foo FormControl всегда ложен, (myForm.get('foo').valid всегда ложен ).

Что не так с моей реализацией?

Answer 1

вам просто нужно вернуть ноль, когда проверка в порядке. и измените этот метод, как показано ниже

private allowedValues: ValidatorFn (control: FormControl) => {
    if (this.allowedValuesArray.indexOf(control.value) !== -1) {
        return {'notValidFoo': true};
    }
    return null;    
}