angular表单校验-模板驱动表单校验

最新推荐文章于 2024-03-10 12:38:17 发布

原创

最新推荐文章于 2024-03-10 12:38:17 发布 · 2.1k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#angular

这篇笔记记录了Angular中使用模板驱动表单进行重复密码校验的过程，包括自定义校验器`repeat-password`的实现。在创建指令时需要注意避免添加不必要的前缀，并确保输入框绑定的字段名与指令匹配。出现问题时，参考链接中的大神博客可以找到解决方案。

本文仅仅是作为自己的笔记，因此没有详细解释，建议查看大神博客：https://www.pocketdigi.com/20170208/1561.html

模板

<form id="login-form" class="login-from" #registerForm="ngForm" (ngSubmit)="doSubmit(registerForm.value)">
        <mat-form-field>
          <input matInput placeholder="邮箱" id="email" name="email" [(ngModel)]="formData.email" required pattern="[\w]+?@[\w]+?\.[a-z]+?">
          <mat-error *ngIf="formErrors.email">{
   
   { formErrors.email }}</mat-error>
        </mat-form-field>

        <fieldset ngModelGroup="passwordGroup" #passwordGroup="ngModelGroup" aria-required="true">
          <mat-form-field>
            <input matInput placeholder="密码" type="password" id="password" name="password" [(ngModel)]="formData.password" #password="ngModel