首页 > 解决方案 > 使用正则表达式的 Angular 响应式表单中的模式验证器

问题描述

我的要求是添加一个 Angular 反应式模式验证器,当表单控件“名称”包含关键字“用户”(不区分大小写)时,它会产生错误“名称无效”

这是我的表单组

new FormGroup({
      name: new FormControl('', [Validators.required, Validators.pattern('/user/i')]),
      userType: new FormControl('', [Validators.required]),
    })

HTML 部分

            <input
              type="text"
              class="form-control"
              id="name"
              aria-describedby="yourName"
              formControlName="name"
            />

              <div class="error-msg" *ngIf="testForm.get('name').hasError('required')  && testForm.get('name').touched">
                Name is required
              </div>
              <div class="error-msg" *ngIf="testForm.get('name').errors?.pattern  && testForm.get('name').touched">
                Name is invalid 
              </div>
        

我用或多或少相似的上下文研究了堆栈上的多个答案,但似乎找不到我在这里做错了什么。任何帮助表示赞赏。

标签: regexangularangular-reactive-formsangular-validation

解决方案


推荐阅读