首页 文章

模板驱动的AngModel形式Angular 2

提问于
浏览
0

我是Angular 2的新手,并试图学习它 . 我正在学习一些youtube视频,当我学习模板驱动的表格时,我遇到了一种情况......我无法理解 .

在其中一个视频中有一个示例,其中创建了一个表单,并为每个输入元素赋予了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模型?视频中的人解释说它将每个输入元素与表单绑定,但我无法理解它是如何绑定的,确切的流程?我应该把它视为一种语法吗?请帮我解决这个问题

1 回答

  • 0

    NgModel不是您使用的每个输入元素的先决条件 . 请看看angular official doc

    另外rangle.io在ng2上有很多东西,并且有很好的解释 .

    通常,ngModel仅用于必要的双向数据绑定 . Angular 2默认支持单向数据绑定

相关问题