2017-05-31 21 views
0

私はAngular 2を初めて使用しています。私はいくつかのYouTubeのビデオを通じて学習していました。テンプレート駆動のフォームを学習しているうちに、私は理解できない状況に遭遇しました。以下>テンプレート駆動型のngModel Angular 2

- フォームが作成され、すべての入力要素は、属性、 ngModel与えられているが、私はこのフォームでngmodelを書くの目的を理解することができませんでした例があったビデオのいずれかで

-

<div class="container"> 
<div [class.myClass]="applyClass" > 
<h1>First Form</h1> 
</div> 
<form #userFrom="ngForm" novalidate (submit)="onsubmit(userFrom)"> 
<div class="form-group"> 
<label>Student id</label> 
<input type= "text" #_idRef class="form-control" name="id" ngModel> 
<span>{{_idRef.className}}</span> 
</div>  

<div class="form-group"> 
<label>Student Name</label> 
<input type= "text" class="form-control" name="sname" ngModel>  
</div> 

<div class="form-group"> 
<label>Street</label> 
<input type= "text" class="form-control" name="street" ngModel>  
</div> 


<div class="form-group"> 
<label>City</label> 
<input type= "text" class="form-control" name="city" ngModel>  
</div> 


<div class="form-group"> 
<label>Postal Code</label> 
<input type= "text" class="form-control" name="pcode" ngModel>  
</div> 

<button class="btn btn-primary">SUBMIT</button> 
</form>  
</div>  

上記のコードの各入力要素でngモデルが使用されている理由を教えてください。動画の男は、各入力要素をフォームにバインドすると説明していますが、バインドの仕組み、正確なフローを理解できませんでしたか?これを構文と見なすべきですか?この文で私を助けてください

+0

公式ドキュメント:* NgFormディレクティブは、追加の機能を持つフォーム要素を補足します。 'ngModel'ディレクティブと' name'属性を使って要素のために作成したコントロールを保持し、それらのプロパティ(妥当性を含む)を監視します。*それが必要なのです。変数をバインドするためにngModelを使うのと同じように、フォームコントロールをフォームにバインドする必要があります。 'name'属性と' ngModel'がなければ、何も束縛していないので空のフォームオブジェクトで終わるだけです。 – Alex

答えて

0

NgModelは、使用するすべての入力要素の前提条件ではありません。どうぞご覧くださいangular official doc

rangle.ioはng2以上のものが多く、よく説明されています。

一般的に、ngModelは、必要な場合に双方向データバインディングにのみ使用されます。角2はデフォルトで単方向データバインディングをサポートします

+0

この回答は間違っています。フォームにバインドするにはここに 'ngModel'が必要です。あなたがリンクしているドキュメント(それは私がコメントの抜粋を選んだ場所から) – Alex

関連する問題