Question

我使用Angular 2的html验证创建了一个表单。

当用户点击某个按钮时，我想检查输入的状态（没有空，正确的格式等）。目前我按照以下方式执行此操作：

    <form id="memberForm" #memberForm="ngForm" >
        <input
          type="text"
          id="MemberName"
          required
          name="MemberName"
          [(ngModel)]="newMember.name">        
    </form>
    <div  
        [ngClass]="{'button_disabledButton' : !memberForm?.valid}" 
        (click)="onSubmit(memberForm?.valid, memberForm);"> 
            <span>Next</span>
    </div>

有了这个，我只是在点击并关注时评估输入。当用户点击＆＃34;下一步＆＃34;元件？

Answer 1

您应该为ngModel输入制作getter / setter解决方案。在相应类的.ts文件中输入：

savedVar:string = '';
get variable(): string {
  return this.savedVar;
}
set variable(str: string) {
  this.savedVar = str;
  // do your validation
}

在模板中使用ngModel =变量，如下所示：

<input [(ngModel)]="variable">

Angular 2 html表单验证

1 个答案: