Question

我正在使用反应形式方法开发Angular 5表单模块。在我的一个表单控件的表单中，我需要进行一些后端验证，有人可以帮助实现composeAsync函数处理后端验证吗？

Answer 1

这是我的实现方式（用于用户名检查）

首先，我添加了一个报表验证功能以进行重发验证

this.regForm = this.fb.group({
      userName: ['', Validators.required, 
                 this.validateUserIDNotTaken.bind(this) ],
      password: [ '', [Validators.required]]
});

然后

validateUserIDNotTaken(control: AbstractControl) {
    return this.userService.validateUserIDNotTaken(control.value).map(res => {
      return res ? null : { unTaken: true };
    });
}

在用户服务中

export class validateUserIDNotTaken{
  static createValidator(userService: UserService) {
    return (control: AbstractControl) => {
      return userService.validateUserIDNotTaken(control.value).map(res => {
        return res ? null : { unTaken: true };
      });
    };
  }
}

并将其添加到模板

<div *ngIf="regForm.get('userName').errors && regForm .get('userName').errors.unTaken">
   This userName is already taken!
</div>

如何将composeAsync添加到angular 5验证器

1 个答案: