Question

我正在使用ngRepeat进行ul列表，如下所示

<ul class="dropdown-menu dropdown-menu-right" role="menu" style="overflow:auto; max-height:180px;">
    <li ng-repeat="(k, v) in dataDict">
        <a href="" ng-click="$parent.dataField = k">{{v}}</a>
    </li>
</ul>

Javascript代码的工作原理如下：

app.controller("myController", ["$scope", function ($scope) {
    $scope.dataField = "";
    $scope.dataDict= {};
    $scope.addElement = function (key, value) {
        $scope.dataDict[key] = value;
    }
    $scope.removeElement = function (key) {
        delete $scope.dataDict[key];
    }
}]);

当我添加元素时，它可以正常工作。

当我删除它时仍然可以看到用户，但不是可用的形式javascript。如何使删除工作有效？

我发现对于标准数组，您可以像array.splice(index, 1);那样执行，但对于像对象这样的字典，这是不可能的。

Answer 1

很难说为什么这对你不起作用，但我猜想AngularJS使用的某种缓存机制不符合绑定对象的删除调用NG-重复。

以下是一些替代方案：

选项1： 考虑使用列表而不是对象。您的代码将经历非常小的更改 - 而不是重复对象的键/值，您将迭代具有关键字段和值字段的对象列表。非常直截了当。您可以按照问题中提到的方式拼接列表，而不是删除。

选项2： 如果您坚持使用键/值重复方法，请考虑在使用新数据dict调用removeElement时替换该对象，该数据类似于前一个，减去不需要的键 - 如下所示：

$scope.removeElement = function (key) {
  var newDataDict = {};
  for (var dataKey in $scope.dataDict) {
      if (key !== dataKey) {
          newDataDict[dataKey] = $scope.dataDict[dataKey];
      }
  }

  $scope.dataDict = newDataDict;
}

Answer 2

原来我在子控制器中的类字典对象上添加了$watch，无意中重新添加了删除记录。在修复$watch代码后，角度中的所有内容都应该正常工作。

AngularJS - ng在类字典对象中删除的元素处重复不更新

2 个答案: