FormControl 验证器总是无效

Question

按照我之前的，我正在尝试创建一个自定义验证器，允许用户在文本输入中仅键入特定值。

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 始终为 false，（myForm.get('foo').valid 始终为 false）。

我的实现有什么问题？

Answer 1

当验证正常时，您只需要 return null。并像下面那样更改该方法

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

FormControl 验证器总是无效

FormControl validator always invalid

javascript

angular

formgroups