Keeping Track Of Nested Ng-repeat Index's

Question

So I have a nested ng-repeat like so:

Index: {{ $index }}

D

Solution 1:

You can get rid of $flowIndex, it's not necessary, you can use $parent.$index instead, when you are using ngRepeat it creates a child scope and $index is part of that scope. Also consider moving your deleting logic into the controller.

Controller:

$scope.delete = function ($index) {
    $scope.flow.splice($index, 1);
};

Html:

<div ng-repeat="data in flow">

    Index: {{ $index }}
    <div ng-click="delete($index)">Delete me</div>

    <div ng-repeat="inside_data in flow[$index]">
        Inside index: {{ $parent.$index }} -> {{ $index }}
    </div>
</div>

Solution 2:

I believe you can get the parent index like so:

$parent.$index

As mentioned in this answer: passing 2 $index values within nested ng-repeat

Baca Juga

That way you don't have to worry about your variable being out of sync with your current state.

Solution 3:

I just tested your similar code with some dummy data strings and the delete appears to work. I made some updates to your code to better analyze it.

// Code goes herevar myApp = angular.module('myApp',[]);

myApp.controller('MyController', ['$scope', function($scope) {
  $scope.flow = [
    ["test01","test02","test03"],
    ["test11","test12","test13"],
    ["test21","test22","test23"],
    ["test31","test32","test33"],
    ["test41","test42","test43"]
  ]
  ;
}]);

<!DOCTYPE html><html><head><scriptdata-require="angularjs@1.5.8"data-semver="1.5.8"src="//opensource.keycdn.com/angularjs/1.5.8/angular.min.js"></script><linkrel="stylesheet"href="style.css" /><scriptsrc="script.js"></script></head><bodyng-app="myApp"><sectionng-controller="MyController"><divng-repeat="data in flow">
  
      Index: {{ $index }}
      <divng-click="flow.splice($index, 1)">Delete me [{{ $index }}]</div><divng-repeat="inside_data in flow[$index]">
          Inside index: {{ $index }} : {{ inside_data }}
      </div><hr></div></section></body></html>

JavaScript Guide

Keeping Track Of Nested Ng-repeat Index's

Solution 1:

Solution 2:

Solution 3:

Post a Comment for "Keeping Track Of Nested Ng-repeat Index's"