如何在不破坏角度数据绑定的情况下更新集合中的项

how can i update an item in a collection, without breaking angular databinding?

本文关键字:情况下 更新 集合 数据绑定      更新时间:2023-09-26

我有一个对象集合,我认为这被称为关联数组。无论如何,我想在列表中找到一个项目并更新它。顺便说一句,这个集合是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;
    }
})

每个的角度