我知道angular 2中基本的双向绑定,就像文档中展示的那样。
我有一个person
数组,我正在使用它来构建一个html列表:
现在,当我点击一个人的行时,我可以使用双向绑定进行编辑:
<form>
<label>Name: </label>
<input [(ngModel)]="selectedPerson.name" name="name"/>
<label>Description: </label>
<input [(ngModel)]="selectedPerson.job" name="job"/>
</form>
现在,我想要的是对列表本身进行双向绑定:(该列表位于与行编辑器不同的视图中)
<div class='row' *ngFor="let person of model">
<div class='col'>{{person.name}}</div>
<div class='col'>{{person.job}}</div>
</div>
目前,我正在使用*ngFor
来列出所有人。如果我的model
是一个包含两个人的数组,那么就会有两行。有时model
可能会改变,例如有3或4个人。是否有办法让angular检测到这一点并相应地添加行?在这里似乎不适用于[(ngModel)]
。
基本上,我希望我的列表视图在无需刷新页面的情况下更新。如何使ngFor
中使用的model
监听更改?
model
与另一个组件共享,还是 'list' 在同一个组件定义中作为你的行编辑器? - David Blaney