Как получить доступ к элементам из ng-repeat внутри дочерней директивы

Question

, поэтому я пытаюсь получить переменные из ng-repeat в директиве, которая находится внутри ng-repeat. Я не могу понять это, я смотрел пару вещей «@» и «=», но я не думаю, что правильно их использую, может ли кто-нибудь дать мне ясный пример того, как достичь этого пожалуйста, и спасибо.

index.html

<li ng-repeat="item in menu"> 
    <div backImg="{{item.img}}" class="homeimg"></div>       
</li> 

directive.js

app.directive('backImg', function(){ 
    return function(scope, element, attrs){ 
     var url = attrs.backImg; 
     scope: { 
      backImg:'=' 
     } 
     /* 
     element.css(
      //'background-image': 'url("/angular/my_first_project/v4/images/home_spiderman.jpg")' 
      'background-color','yellow', 
      "border", "1px solid orange" 
     ); 
     */ 

     element.css("background", "yellow"); 
    }; 
}); 

Answer 1

Как уже упоминалось @Satpal, вы область определяется с привязкой двунаправленные данные, так что вам нужно, чтобы не использовать интерполяцию для атрибут в HTML. Однако вы также не указали Директиву правильно (на самом деле это выглядит как недопустимый JavaScript).

app.directive('backImg', function(){ 
    return { 
     scope: { 
      backImg:'=' 
     }, 
     link: function(scope, element, attrs){ 
      var url = scope.backImg; 

      /* 
      element.css(
       //'background-image': 'url("/angular/my_first_project/v4/images/home_spiderman.jpg")' 
       'background-color','yellow', 
       "border", "1px solid orange" 
      ); 
      */ 

      element.css("background", "yellow"); 
     } 
    }; 
}); 

Кроме того, вы должны использовать пунктирную версию атрибута back-img в HTML:

<li ng-repeat="item in menu"> 
    <div back-img="item.img" class="homeimg"></div>       
</li>