Question

<body ng-controller="SomeListCtrl">

  <ul>
    <li ng-repeat="user in users">
      {{bindUserToImg(user.id)}}
    </li>
  </ul>

  <button ng-click="update()">Update img</button>
</body>

function SomeListCtrl($scope) {
  $scope.users = [
    {id: 1},
    {id: 2},
    {id: 3}
  ];

  $scope.images = {
    1: {src: 'img-1'},
    2: {src: 'img-2'},
    3: {src: 'img-3'}
  };

  $scope.bindUserToImg = function(x) {
    console.log(x);

    return $scope.images[x].src;    
  };

  $scope.update = function() {
    $scope.images[2].src = 'updated-img';    
  };
}

代码：http://jsbin.com/sanipiki/1/

我将用户绑定到图像上。现在，如果某些图像发生更改（调用'update'方法更改图像＃2），angular将刷新所有用户（将为'users'数组中的每个元素调用方法'bindUserToImg'）。是否可以使角度更新特定图像并防止刷新所有字典元素？

Answer 1

不，这是不可能的。简化，当您更改范围属性时，angular将触发摘要周期以查看范围上的任何其他属性是否已更改。目前没有机制将摘要周期限制在某个范围/组件中。

在你的情况下，角度还是不可能“知道”只有图像编号2的绑定发生了变化。 bindUserToImg可能有任意数量的复杂副作用随其输入而改变（并且依赖于函数参数以外的变量），因此angular必须为所有绑定执行它。

一般规则是最小化范围绑定的复杂性，因为它们经常执行。第一步是不使用函数，因为它们比简单的对象查找更昂贵。使用

可以轻松简化您的示例

<li ng-repeat="user in users track by $index">
  {{images[user.id].src}}
</li>

如果某个元素已被更改，如何刷新整个字典？

1 个答案: