码迷,mamicode.com
首页 > 其他好文 > 详细

[Angular2 Form] Display Validation and Error Messaging in Angular 2

时间:2016-09-27 19:28:20      阅读:189      评论:0      收藏:0      [点我收藏+]

标签:

Angular 2’s ngModel provides error objects for each of the built-in input validators. You can access these errors from a reference to the ngModel itself then build useful messaging around them to display to your users.

 

First, you can use ‘ngModel‘ from ‘FormsModule‘ from angualr2 build module.

<section>
  Min length & required: <input type="text" [(ngModel)]="message" #messageRef="ngModel" required minlength="5">
  <pre>
    Errors: {{messageRef.errors | json}}
    Valid: {{messageRef.valid}}
  </pre>
  <div *ngIf="!messageRef.valid">
    <div *ngIf="messageRef.errors?.required">This field is required</div>
    <div *ngIf="messageRef.errors?.minlength">Min length is {{messageRef.errors?.minlength.requiredLength}}, but now only {{messageRef.errors?.minlength.actualLength}}</div>
  </div>
  <br />
  <hr/>

  <button md-button class="md-raised">Add</button>
</section>

 

Github

[Angular2 Form] Display Validation and Error Messaging in Angular 2

标签:

原文地址:http://www.cnblogs.com/Answer1215/p/5913786.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!