首页 > 解决方案 > Angular 5 模式验证不适用于动态响应式表单

问题描述

我正在尝试使用带有正则表达式模式的角度反应形式来实现字段验证##.##.##.##。对于某些模式,它不起作用。我尝试了以下未通过验证的输入,使用regextester12.25.36.25测试了该模式,效果很好。我不确定这里出了什么问题。任何帮助深表感谢。(^\d{2}.\d{2}.\d{2}.\d{2}$)

这是StackBlitz

标签: angulartypescript

解决方案


原因是您忘记在class question-basecalled中添加一个字段pattern。这是代码:

export class QuestionBase<T> {
  ...
  pattern: string;

  constructor(options: {
      ...
      pattern?: string
    } = {}) {
    ...
    this.pattern = options.pattern || null
  }
}

另一个问题是##.##.##.## 不是有效数字。您需要将该输入更改为 type text。最后,如果您的模式是正则表达式,您需要使用 javascript 的正则表达式类型而不是字符串。将您的模式替换为/^\d{2}.\d{2}.\d{2}.\d{2}$/

编辑:模型的最终形式应该是:

new TextboxQuestion({
        key: 'version',
        label: 'Release Number',
        type: 'text',
        required: true,
        order: 4,
        pattern: /^\d{2}.\d{2}.\d{2}.\d{2}$/ // needed format: ##.##.##.##
 })

推荐阅读