Angular 2将参数变量传递给验证器函数

时间:2017-02-13 21:28:26

标签: javascript angularjs

我有一个自定义验证器,需要访问本地组件的变量。在我的组件中,我有一个变量布尔值,当用户与表单

交互时,它会被更改
export class MyForm implements OnInit{
  public localBool : boolean;

  constructor(public fb: FormBuilder)
  ngOnInit(){
     this.form = this.fb.group({
         field : ['', [CustomValidator.validateIfRequired(this.localBool)]]
     })
  }

}


export CustomValidator {
    static validateIfRequired(condition:boolean){
          console.log(condition);
          ....
    }

}

我得到未定义当我像这样使用它时

CustomValidator.validateIfRequired(this.localBool) 

但是当我像这样使用它时我会成真

CustomValidator.validateIfRequired(true)

如何传递或评估局部变量? +1以简要说明Angular如何评估参数以及为什么我未定义。

1 个答案:

答案 0 :(得分:0)

你应该使用像这样的验证器

import {Control} from "@angular/common";

interface ValidationResult {
    [key: string]: boolean;
}

export function emailFormat(control: Control): ValidationResult {
    var EMAIL_REGEXP = /^[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?/;

    if (control.value != "" && (control.value.length <= 5 || !EMAIL_REGEXP.test(control.value))) {
        return {"incorrectMailFormat": true};
    }
    return null;
}

export class LoginPage {
    public loginForm: ControlGroup;

    constructor(private fb: FormBuilder) {
        this.loginForm = fb.group({
            'email': ['', Validators.compose([Validators.required, emailFormat])],
            'password': ['', Validators.compose([Validators.required, Validators.minLength(6)])]
        });
    }
}