当它无效时，如何更改Angular 5中的字段验证器？

Question

所以，我有用于用户表单的代码。

从NODE屏蔽了电话号码，如下所示：

   module.exports = ({
      props
    }) => {
      const phone =  props.phoneNumber;
      if (phone) {
        const prefix = phone.substr(1, 1);
        const suffix = phone.substr(phone.length - 3);
        const masking = '******';
        const fullmask = '**********';
        return `${  prefix}${  masking}${  suffix}`;
      }
      return `${  fullmask}`;
    };

表单打开时，它是：

1）不脏 2）不接触 3）由于电话号码字段无效，因此无效

以下是“电话号码”的开发控制台中的

这是我用来尝试并强制电话号码字段有效的代码

//WE NEED TO MANUALLY CHANGE THESE PROPS for this field
//As its NOT TOUCHED, NOT DIRTY and NOT INVALID out of the gate
if (this.accountForm.controls.phoneNumber.touched === false &&
  this.accountForm.controls.phoneNumber.dirty === false) {
  this.accountForm.controls['phoneNumber'].setErrors({'invalid': false});
  this.accountForm.controls['phoneNumber'].setErrors({'status': 'VALID'});
  this.accountForm.controls['phoneNumber'].valid = true;
}
//Normal ERROR CHECKING once TOUCHED and DIRTY
if (this.accountForm.controls.phoneNumber.touched === true) {
  if (this.accountForm.controls.phoneNumber.dirty === true) {
    if (controlName === 'phoneNumber' &&
      this.accountForm.controls.phoneNumber.invalid === true) {
      result += (`${label} is not in a proper format.`);
      return (result);
    }
  }
}

问题：如何防止此“一个字段”开始无效？没道理吗？

注意：HIPAA需要9 ****** 251遮罩。即将到来，但我们的EMAIL字段以相同的方式被屏蔽，并且“ IS”有效。

我们正在使用ANGULAR 5和Angular Material 2

Answer 1

当用户输入数据时，使用的正则表达式可能来自INPUT表单验证。

现在，在更新过程中，该数字将被屏蔽，因此它包含*，如您在图像中看到的那样。

将您的验证程序正则表达式修改为^[2-9]{1}[\*]{6}[0-9]{3}$