Angularjs的模型在嵌套的ng-repeat中没有更新
Angularjs model not updating inside nested ng-repeat
我使用嵌套的ng-repeat在对象数组的属性内部循环,并将对象值的模型绑定到输入。问题是,当输入中的值发生变化时,模型不会更新。
var app = angular.module('app', []);
app.controller('main', function($scope) {
var vm = this;
vm.data = [{
"user": "*US/",
"lowFare": "*TP/<amount>/S<segment>/P<passenger>",
"fullFare": "*PR/<amount>/S<segment>/P<passenger>",
"selectedReason": "*REA/"
}, {
"user": "US/",
"selectedReason": "REA/"
}];
vm.description = {
"user": "User",
"lowFare": "Lowest fare *",
"fullFare": "Fare without restrictions *",
"selectedReason": "Reason for applying the fare"
};
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-cloak>
<div ng-controller="main as ctrl">
<div ng-repeat="block in ctrl.data">
<h4 align="center">block number {{$index}}</h4>
<table align="center">
<tr ng-repeat="(key,value) in block" align="center">
<td><span>{{ctrl.description[key]}}:  </span>
</td>
<td>
<input ng-model="value" />
</td>
</tr>
</table>
</div>
<h3 align="center">
<br/>Modify something and see that the model doesn't change:  
<br/>
</h3>
<p>
{{ctrl.data}}
</p>
</div>
</div>
小提琴:https://jsfiddle.net/Kitra/qtxx9y35/
只需将ng-model="value"更改为ng-model="block[key]",就可以完成任务了。
我不确定,但我猜这与javascript引用对象和数组的事实有关,而原始值是按值传递的。
var app = angular.module('app', []);
app.controller('main', function($scope) {
var vm = this;
vm.data = [{
"user": "*US/",
"lowFare": "*TP/<amount>/S<segment>/P<passenger>",
"fullFare": "*PR/<amount>/S<segment>/P<passenger>",
"selectedReason": "*REA/"
}, {
"user": "US/",
"selectedReason": "REA/"
}];
vm.description = {
"user": "User",
"lowFare": "Lowest fare *",
"fullFare": "Fare without restrictions *",
"selectedReason": "Reason for applying the fare"
};
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-cloak>
<div ng-controller="main as ctrl">
<div ng-repeat="block in ctrl.data">
<h4 align="center">block number {{$index}}</h4>
<table align="center">
<tr ng-repeat="(key,value) in block" align="center">
<td><span>{{ctrl.description[key]}}:  </span>
</td>
<td>
<input ng-model="block[key]" />
</td>
</tr>
</table>
</div>
<h3 align="center">
<br/>Modify something and see that the model doesn't change:  
<br/>
</h3>
<p>
{{ctrl.data}}
</p>
</div>
</div>
试着像这样改变你的"ng-model"属性:
<input ng-model="block[key]" />
https://jsfiddle.net/mladenplavsic/qtxx9y35/51/相关文章:
- 更新嵌套对象的多个字段
- 更新嵌套json Angularjs中的对象
- React:使用索引变量更新嵌套集合
- 在javascript中动态更新嵌套对象
- 使用Javascript查找并更新嵌套JSON数组和对象中的所有键值
- jquery 更新嵌套对象的键
- Sails.js - 如何更新嵌套模型
- 在Redux中更新嵌套状态的更干净/更短的方法
- 如何更新嵌套对象中的var
- 使用(ES6)计算的属性名称更新嵌套对象
- 如果发现使用其他值更新嵌套属性,则添加该属性
- 操作JSON对象:如何引用和更新嵌套值
- 更新嵌套angular 2组件中的number字段值
- 使用Mongoose更新嵌套对象
- MongoDB:更新嵌套数据,但避免多个对象
- 如何更新嵌套的用户集合
- Angular JS不更新嵌套对象上的视图
- Angular.js视图没有't在更新嵌套的$scope数组时更新
- mongoose更新嵌套值
- 浅拷贝不更新嵌套JSON对象javascript