角。 如何获得ng-repeat项目范围

Question

码：

<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操作的情况下访问此范围？

Answer 1

在控制器中定义数组。 然后您可以轻松访问：

<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]...
})

Answer 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 /其他）。 仅内部指令 ，即使尝试使其保持最小。

Answer 3

Disclamer：请勿在实际应用中使用此代码！

好的，这是一件可怕的事情，但是出于学术兴趣，我将发布关于如何从控制器获取子范围的答案。

由于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