Question

更新找到可能相同或几乎相同的问题： AngularJS: ng-repeat list is not updated when a model element is spliced from the model array

最终为我工作的是使用以下内容更改过滤器功能：

$scope.deleteRole = function (roleID) {
    var pickIndex = findWithAttr($scope.dtbRole, "ROLEID", roleID); //to find array index       
    $scope.dtbRole.splice(pickIndex, 1);
    $scope.$apply();
  }

我认为我对何时不使用$ apply（）有了一个很好的理解，但我想这是一个使用它的地方。这有什么不利之处吗？

原文：

如果对此有直接的答案我很抱歉，但是使用几十种术语组合进行搜索已经为我带来了很多东西，部分原因是，我确定，对于ngRepeat的过滤器和JS的过滤方法共享一个名称。我已经在这里找到了数百个问题的答案而没有张贴过，但我已经空手而归了。

我去年年底刚刚接触Angular，但过去几个月我学到了很多东西（很大程度上要归功于这个网站！）。我有一个接近完美的ngRepeat工作（我将会及时＃34;接近 - ＆＃34;片刻之后）：

<tr ng-repeat="role in dtbRole | orderBy:'-PERCENT'">  
  <td>
    <input ng-model="role.PERCENT" class="form-control" type="text" />
  </td>
  <td>
    <input ng-model="role.DESCRIPTION" class="form-control" type="text" />
  </td>
  <td>
    <button type="button" class="btn btn-danger" ng-click="deleteRole(role.ROLEID)">
      &times;
    </button>
  </td>
</tr>

在该删除按钮中运行的脚本非常简单：

$scope.deleteRole = function (roleID) {        
  $scope.dtbRole = $scope.dtbRole.filter(function (obj) {
    return obj.ROLEID !== roleID;
  });
}

我已经在一些console.log（）行中抛出，以确保它正在做它应该做的事情，事实确实如此。奇怪的部分，以及我说它接近完美工作的原因是，在网页本身，视觉效果不会更新，直到我点击进出应该删除的项目中的输入，有时我必须在它发生之前做几次。我无法弄清楚究竟是什么触发了更新，但只是无所事事就不会更新它（尝试进行15分钟的休息，无济于事）。 JS控制台坚持认为dtbRole会立即更新。没有性能高峰，没有交通延误，没有冻结或不稳定......我很难过。我甚至在jsfiddle上做了一些简单的重拍，看看我是否可以复制这个问题，但我无法做到。它在其他任何地方都是即时的，我无法发现它们的不同之处。

更重要的是，我在ngRepeat之后有另一个区域来向dtbRole添加项目，并且它会在视觉中立即更新：

$scope.addRole = function (perc, desc) {
  $scope.dtbRole.push({ "ROLEID": idGen(), "PERCENT": perc, "DESCRIPTION": desc });
  $scope.addRolePercent = ''; //clear input
  $scope.addRoleDesc = ''; //clear input
}

这一切看起来都很简单，但经过几天的努力之后，我会承认我还需要几双眼睛来看看我做错了什么。

所以我想问一下，对于一个更资深的Angular或JS开发人员来说，是否存在一些明显的错误，或者我是否可以使用不同的技术来达到同样的效果。

Angular ngRepeat + JS过滤器方法导致奇怪的渲染延迟

0 个答案: