2015-01-23 2 views
3

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

<html ng-app="MyApp"> 
    <head> 
    <script type="text/javascript" src="angular.js"></script> 
    <script type="text/javascript"> 
    var MyCtrl = function($scope) { 
     $scope.blah = [1,2,4,5]; 
     $scope.bar = [14,52,64,25]; 
    } 
    angular.module("MyApp", []) 
    .directive("sephBlah", function($parse) { 
     return { 
      scope: { 
      tags: "=sephBlah" 
      }, 
      link: function(scope, elem, attrs) { 
      console.log(scope.tags[0]); 
      } 
     } 
    }); 
    </script> 
    </head> 
    <body ng-controller="MyCtrl"> 
     <div seph-blah="blah"> 
     <p data-ng-repeat="t in tags">{{t}}</p><!-- why this renders nothing? --> 
     </div> 

     <div seph-blah="bar"> 
     <p data-ng-repeat="t in tags">{{t}}</p><!-- why this renders nothing? --> 
     </div> 
    </body> 
</html> 

Я не уверен, почему ng-repeat ничего не делает. Функция ссылки правильно видит массивы.

ответ

1

Вы не должны использовать такие директивы. Тип функции, которую вы пытаетесь получить здесь, должен выполняться с помощью контроллера.

При использовании директив используйте атрибут template или templateUrl для предоставления контента. Так что это будет работать:

.directive("sephBlah", function($parse) { 
    return { 
     scope: { 
     tags: "=sephBlah" 
     }, 
     template: '<p data-ng-repeat="t in tags">{{t}}</p>', 
     link: function(scope, elem, attrs) { 
     console.log(scope.tags[0]); 
     } 
    } 
}); 

И в HTML просто сделать:

<div ng-attr-seph-blah="blah"></div> 
Смежные вопросы