如何在不破坏角度数据绑定的情况下更新集合中的项
how can i update an item in a collection, without breaking angular databinding?
我有一个对象集合,我认为这被称为关联数组。无论如何,我想在列表中找到一个项目并更新它。顺便说一句,这个集合是select的ng模型。我知道lodash有这种功能。我可以找到该项,但我不确定更新该项的最佳方式是什么,因此数据绑定仍然适用于我的选择。
下面是一个不起作用的例子:
for (x = 0; x < $scope.RulesTemplates.length; x++)
{
if($scope.RulesTemplates[x].Name == $scope.TempRules.Name)
{
$scope.RulesTemplates[x] = $scope.TempRules;
}
}
假设一个样本数据集,如果您想扩展绑定到ng选项的数组中的现有对象,您首先需要确保angular具有由特定的唯一属性跟踪的数组项。然后,您可以只更新阵列中相应位置的新项,angular将自动在绑定的选择选项中执行更新(而无需重新渲染其他选项值)。但这种方法可能不会刷新已经绑定的ng模型。
使用传统循环的另一种简单方法:-
<select ng-options="item.display for item in items" ng-model="selected"></select>
你的更新逻辑可以是:-
for (x = 0, l = $scope.items.length; x < l; x++){
var item = $scope.items[x];
if(item.name == itemsUpdate.name) {
angular.extend(item,itemsUpdate); //Extend it
break;
}
}
Demo1
或者由于您使用的是lodash
,代码行可能更少:-
var item = _.first($scope.items, {name:itemsUpdate.name}).pop(); //Get the item add necessary null checks
angular.extend(item, itemsUpdate);
Demo2
angular.extend
将确保底层源对象引用在更新属性时保持不变,您也可以使用lodash merge
。
试试这样的东西:
angular.forEach($scope.RulesTemplates, function(value, key){
if(value.Name == $scope.TempRules.Name){
value = $scope.TempRules;
}
})
每个的角度
相关文章:
- 如何在不刷新页面的情况下更新显示框
- 获取 HTML 5 音频控制文件位置并在不使用 id 选择器的情况下更新 src
- 在不重定向页面的情况下更新表
- Angular/UI路由器-如何在不刷新所有内容的情况下更新URL
- 如何在不按ctrl+F5的情况下更新我的Web应用程序(chrome、mozilla、IE8+)更改
- 可以在不重新加载页面的情况下更新javascript中的cookie
- 在不重新加载控制器的情况下更新路由
- 在不重新加载页面的情况下更新 URL 哈希
- 在不重新加载页面的情况下更新块中的内容
- 需要 Ajax 函数 - 在不刷新页面的情况下更新数据库
- 在不加载页面的情况下更新谷歌地图上的标记位置
- 在不刷新的情况下更新标签内的变量
- 在不超出页面的情况下更新数据库
- 如何在不使用映射的情况下更新视图模型
- 在不刷新页面的情况下更新 SQL 数据
- 如何在代码点火器中使用 websocket 在不刷新页面的情况下更新内容
- 如何在不刷新浏览器的情况下更新倒计时达到 0 时的日期
- 在不触发状态更改的情况下更新 URL
- 在不重新加载整个页面的情况下更新网页的特定区域
- GULP:如何在不刷新的情况下更新浏览器(仅适用于 CSS 更改)