Angular2：md-inputを使用した検証

Question

Angular2の新機能です。フォームで検証を実装しようとしています。しかし、それは私のために働いていません。私はこれを試しました

<form #f='ngForm' (ngSubmit)="onSubmit(f.form)"> 
    <md-card> 
    <md-card-content> 
     <div class="frm-ctrl form-group"> 
     <label>Phone Number :</label> 
     <div class="wpr"> 
      <div class="icon"> 
      <i class="fa fa-phone"></i> 
      </div> 
      <md-input ngModel #phonenumber="ngModel" [(ngModel)]="PersonInfo.phonenumber" name="phonenumber" class="ctrl-wpr__ctrl form-group" 
      min-length="4" required></md-input> 
      {{phonenumber.errors | json}} 
     </div> 
     </div> 
    </md-card-content> 
    </md-card> 
</form> 

私が間違っているところを助けてください。

<md-input #phonenumber="ngModel"    //<<<===removed ngModel 
     [(ngModel)]="PersonInfo.phonenumber" 
      name="phonenumber" 
      class="ctrl-wpr__ctrl form-group" 
      min-length="4" required></md-input> 

へ

Answer 1

<md-input ngModel 
      #phonenumber="ngModel" 
      [(ngModel)]="PersonInfo.phonenumber" 
      name="phonenumber" class="ctrl-wpr__ctrl form-group" 
      min-length="4" required></md-input> 

変更これは、あなたがこのコードを使用することができ、返信用

<div [hidden]="phonenumber.valid || phonenumber.untouched" class="alert alert-danger"> 
     phonenumber is required 
</div>