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

Question

Code:

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

How to access this scope without DOM manipulations?

Answer 1

Define the array in the controller. And then you can acces is easily:

<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

What you're trying to do, you can easily get to by doing it inside of the repeater.

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

Also, you never do DOM manipulation (Javascript / jQuery / whatever) inside of a controller / service / factory. Only inside directives , even though try to keep it minimal.

Answer 3

Disclamer: don't use this code in real applications!

Okay this is terrible thing to do, but for the sake of academic interest I'm going to post the answer of how you can get hold of child scope from controller.

Since ngRepeat creates child scopes of the current $scope for every rendered item, all you need to do is read $$childHead ( $first item) and from there check $$nextSibling scopes until you find necessary scope object.

One caveat: you need to run object search during next digest cycle, since there is nothing rendered yet during the digest controller is executed in. So you can use $timeout service for this:

$timeout(function() {
    var childScope = $scope.$$childHead;

    while (childScope = childScope.$$nextSibling) {
        if (childScope.item.id === 3) {
            break;
        }
    }

    console.log(childScope);
    alert(JSON.stringify(childScope.item));
});

Demo: http://plnkr.co/edit/KLtTSnrS8lIEejMhKuby?p=preview