1

我想检查空验证以及信用卡输入检查。

例如:我有 3 个输入字段名称“卡号”、“到期”、“cvv”。我想要的是默认情况下它是可选的,但是如果用户在其中一个字段中输入输入,则用户应该在所有 3 个字段中输入有效输入。

所以验证就像所有输入空白或所有输入都必须有值,如果都有值,它应该检查有效的卡输入验证检查(对于卡号和到期检查,我计划使用第 3 方 npm 模块)。

我从其他堆栈溢出帖子的参考中开始这样:

this.myForm = new FormGroup({
      'name': new FormControl(),
      'birthYear': new FormControl(),
      'card': new FormGroup({
        'cardNumber': new FormControl(),
        'expiry': new FormControl(),
        'cvv': new FormControl('',[NoWhitespaceValidator]),
      },OneFilledOutValidator)
    });

//验证文件

import {FormControl, FormGroup, AbstractControl, ValidatorFn} from '@angular/forms';
import {Observable} from 'rxjs/Observable';

export const OneFilledOutValidator = (): ValidatorFn => {

  return (group: FormGroup): {[key: string]: boolean} => {

    const fields = [];

    for (const field in group.controls) {

      if (group.controls.hasOwnProperty(field)) {
        fields.push(group.get(field).value);
      }
    };

    const result = fields.filter(field => !!field);

    const valid = result.length !== 0;
    console.log(valid);
    return valid ? null : {
      oneFilledOut: true
    };
  };
};

export function NoWhitespaceValidator(): ValidatorFn {

  return (control: AbstractControl): { [key: string]: any } => {

    let isWhitespace = (control.value || '').trim().length === 0;
    let isValid = !isWhitespace;
    console.log(isValid);
    return isValid ? null : { 'whitespace': 'value is only whitespace' }

  };
}

但是没有一个验证器对我有用。

任何人都可以为此提出一个好的起点吗?我该如何实施?
在此正常验证之后,我还需要根据卡号、到期等的常见卡验证来检查卡字段是否真的有效,因此提出相应的建议。

4

1 回答 1

-1

这里有一些错误:

  1. 在函数中包装验证器(): ValidatorFn
  2. 团体需要使用{ validators: OneFilledOutValidator }

此处示例:https ://stackblitz.com/edit/angular-gacawd?file=app%2Fapp.component.ts

于 2018-02-18T06:57:37.360 回答