2016-07-02 3 views
0
<li ng-repeat="value in array1 track by $index"> 
<div ng-repeat="j in array2"> 
     <div example-directive > 
       <p>  {{$index}} ,{{$parent.$index}}</p> 
     </div> 
</div> 
</li> 

В приведенной выше коде я не смог родительский доступ нг-повтор индекс внутри моего пользовательского directive.how я могу получить индекс родительских нг-повторить

+0

Ng-повтор создает свою собственную область применения, если ваш пример директивы делает то же самое, вы пытались $ $ родителя. $ Индекс родителя.? – Noppey

+0

какая конкретная ошибка вы получаете при доступе к родительскому индексу? вы используете свойство transclude директивы? – Ajay

+0

Нет отображения номера yes transclude is true – radha

ответ

0

Этот пример поможет вам выяснить, как получить индекс и т. Д. В директивах.

var app = angular.module("app", []); 
 

 
     app.controller("controller", function ($scope) { 
 

 
      $scope.array1 = [ 
 
       {id: "1-1"}, 
 
       {id: "1-2"} 
 
      ]; 
 

 
      $scope.array2 = [ 
 
       {id: "2-1"}, 
 
       {id: "2-2"} 
 
      ]; 
 

 
     }); 
 

 
     app.directive("exampleDirective", function() { 
 
      return { 
 
       restrict: "A", 
 
       scope: { 
 
        exampleDirective: "=" 
 
       }, 
 
       link: function (scope, element, attr, ngModel) { 
 
        console.log(scope.exampleDirective) 
 
       } 
 
      } 
 
     })
<!DOCTYPE html> 
 
<html ng-app="app" ng-controller="controller as ctrl"> 
 
<head> 
 
    <title></title> 
 
</head> 
 
<body> 
 

 
    <ul> 
 
     <li ng-repeat="value in array1 track by $index"> 
 
      {{value.id}} 
 
      <ul> 
 
       <li ng-repeat="j in array2"> 
 
        <div example-directive="{parentIndex: $parent.$index, childIndex: $index}"> 
 
         {{j.id}} 
 
         <p>array1 index: {{$parent.$index}}</p> 
 
         <p>array2 index: {{$index}}</p> 
 
        </div> 
 
       </li> 
 
      </ul> 
 
     </li> 
 
    </ul> 
 

 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
</body> 
 
</html>

Смежные вопросы