AngularJS how to get index of parent

Question

I have some webapp to change. I made some changes with ng-repeat, new JSON looks like this:

[  
   {  
      "styl":"nowoczesny",
      "dzieci":[  
         {  
            "id":53,
            "bookmark":true,
            "rodzina":"Nekko",
            "page":1
         },
         {  
            "id":69,
            "bookmark":true,
            "rodzina":"Krak",
            "page":2
         },
         {  
            "id":81,
            "bookmark":true,
            "rodzina":"Oxen",
            "page":3
         },
         {  
            "id":93,
            "bookmark":true,
            "rodzina":"Spirala",
            "page":4
         }
      ]
   },
   {  
      "styl":"klasyczny",
      "dzieci":[  
         {  
            "id":109,
            "bookmark":true,
            "rodzina":"Vello",
            "page":5
         },
         {  
            "id":127,
            "bookmark":true,
            "rodzina":"Renzo",
            "page":6
         },
         {  
            "id":135,
            "bookmark":true,
            "rodzina":"Zenit",
            "page":7
         }
      ]
   }
]

HTML like this:

<ul>

    <li ng-repeat="l in list">
      {{l.styl}}&nbsp;
    <ul>
      <li ng-repeat="dziecko in l.dzieci | filter:search "  
          ng-class="{active:isActiveTab(dziecko)}" ng-click="openItem(dziecko)">
                                {{dziecko.rodzina}}&nbsp;
                                <b>{{dziecko.page}}</b>
      </li>
   </ul>
   </li>

Everything works fine despite openItem method, its first version looks like this:

$scope.openItem = function(item) {

        var index = $scope.list.indexOf(item),
                length = $scope.list.length;

        $scope.opened = item;
        $scope.next = $scope.list[index+1];
        $scope.prev = $scope.list[index-1];
    };

How should I modify it to make it works with above html code. I try $index but angular throws an error. (I need to open a new pdf page once I click on a sub-li item on the list).

Thx in advance!

I have to modify it to support new JSON structure [{a,children:[1,b,c]}]... like above.So I wonder how to change line var index = $scope.list.indexOf(item) to get index of a nested child.This line returns -1 because it searches on level 1 not on level 2 in dzieci array. "Dzieci" is a rray of simmilar products inside another object of their parent. — kuba0506, Dec 11 '14 at 14:08

score 0 · Answer 1 · edited May 23 '17 at 12:05

$index should be index of item you need, but if you want to get it from $scope you are going to need index of parent node too, it's available by $parent.$index in nested ng-repeat (described in details here).

So the code will be something like this: html

<li ng-repeat="l in list">
      {{l.styl}}&nbsp;
    <ul>
      <li ng-repeat="dziecko in l.dzieci | filter:search "  
          ng-class="{active:isActiveTab(dziecko)}" ng-click="openItem($parent.$index, dziecko)">
                                {{dziecko.rodzina}}&nbsp;
                                <b>{{dziecko.page}}</b>
      </li>
   </ul>
 </li>

js

$scope.openItem = function(parentIndex, item) {

    var index = $scope.list[parentIndex].dzieci.indexOf(item),
        length = $scope.list.length;

    $scope.opened = item;
    if(index == 0) {
       $scope.next = $scope.list[index+1];
     $scope.prev = $scope.list[$scope.list.length - 1];
   } else if(index == $scope.list.length - 1 ) {
     $scope.next = $scope.list[0];
     $scope.prev = $scope.list[index-1];
   } else {
     $scope.next = $scope.list[index+1];
     $scope.prev = $scope.list[index-1];
   }
};

to maintain prev and next you should work with border indexes correctly.

codepen: http://codepen.io/anon/pen/gbrrgQ

I changed it (and other lines of method) a little bit var index = $scope.list[parentIndex].dzieci.indexOf(item) console.log(index) shows proper numbers but AngularJS throws Error: $scope.list[parentIndex] is undefined — kuba0506, Dec 11 '14 at 14:24
then the issue must be somewhere else, see console log here: http://codepen.io/anon/pen/NPNNNV — Rasalom, Dec 11 '14 at 14:30
OK it works in codepen but you didn't change $scope.next = $scope.list[index+1]; $scope.prev = $scope.list[index-1]; ? to $scope.next = $scope.list[parentIndex].dzieci[index+1]; // $scope.prev = $scope.list[parentIndex].dzieci[index-1]; — kuba0506, Dec 11 '14 at 14:41

AngularJS how to get index of parent

1 Answers1