有棱角的如何获得ng重复项范围的访问权限

Angular. How to get access of ng-repeat item scope

本文关键字：范围 访问 访问权 权限 ng 何获得      更新时间：2024-05-13

代码：

<div ng-controller="someCtrl">
  <span ng-repeat="item in [{id: 1},{id: 2},{id: 3},{id: 4},{id: 5}]"></span>
</div>

Javascript：

.controller('someCtrl', function($scope){
  //how to get access to child scope of element with id===3?
  for(var i = 0,len = $('span').length;i<len;i++){
    if($('span').eq(i).scope().id === 3){
      //do something with scope of element with id===3
    }
  }
})

如何在没有DOM操作的情况下访问此范围？

在控制器中定义数组。然后你可以很容易地访问：

<div ng-controller="someCtrl">
  <span ng-repeat="item in MyList"></span>
</div>
.controller('someCtrl', function($scope){
  $scope.MyList =  [{id: 1},{id: 2},{id: 3},{id: 4},{id: 5}]
  $scope.Mylist[2]...
})

您要做的事情，可以在中继器内部轻松完成。

<div ng-controller="someCtrl">
    <span ng-repeat="item in [{id: 1},{id: 2},{id: 3},{id: 4},{id: 5}]">
        <!-- do whatever you want -->
        <!-- do something specific if it's id === 3 -->
        <span ng-if="item.id === 3">
            <strong>{{ item.id }}</strong> 
        </span> 
    </span>
</div>

此外，您永远不会在控制器/服务/工厂内部进行DOM操作（Javascript/jQuery/anything）。仅在指令内部，即使尽量将其保持在最低限度。

免责声明：不要在实际应用程序中使用此代码！

好吧，这是一件可怕的事情，但为了学术兴趣，我将发布如何从控制器获得儿童范围的答案。

由于ngRepeat为每个渲染项创建当前$scope的子作用域，所以您所需要做的就是读取$$childHead（$first项），然后从中检查$$nextSibling作用域，直到找到必要的作用域对象。

需要注意的一点是：您需要在下一个摘要周期中运行对象搜索，因为在中执行摘要控制器的过程中还没有任何呈现。因此，您可以使用$timeout服务：

$timeout(function() {
    var childScope = $scope.$$childHead;
    while (childScope = childScope.$$nextSibling) {
        if (childScope.item.id === 3) {
            break;
        }
    }
    console.log(childScope);
    alert(JSON.stringify(childScope.item));
});

演示：http://plnkr.co/edit/KLtTSnrS8lIEejMhKuby?p=preview

相关文章：