Директива AngularJS с массивом данных области

Question

У меня есть массив. Каждый элемент массива содержит данные для директивы. Массив создается внутри контроллера.

Модель

$scope.myDirectiveData = 
      [ { title: "First title", content: "First content" }, 
      { title: "Second title", content: "Second content" } ]; 

Директива Шаблон

<div class="MyDirective"> 
    <h1>{{myDirectiveData.title}}</h1> 
    <p>{{myDirectiveData.content}}</p> 
</div> 

Как я должен реализовать директиву, чтобы создать элемент для любого элемента в массиве? Что-то вроде ...

<MyDirective data-ng-repeat="item in myDirectiveData"></MyDirective> 

Answer 1

Вот пример использования директивы. Он использовал ng-repeat для вызова вашей директивы для каждого объекта в массиве в вашей области. В этой скрипке это то, что вы ищете.

http://jsfiddle.net/gLRxc/4/

angular.module('test', []) 

.directive('myDirective', function() { 
    var template = '<div class="MyDirective">' + 
     '<h1>{{ data.title }}</h1>' + 
     '<p>{{ data.content }}</p>' + 
     '</div>'; 
    return { 
     template: template, 
     scope: { 
      data: '=' 
     }, 
     link: function (scope, element, attrs) { 

     } 

    }; 
}) 

.controller('TestController', function ($scope) { 

    $scope.myDirectiveData = [ 
      { title: "First title", content: "First content" }, 
      { title: "Second title", content: "Second content" } 
     ]; 


}) 
; 

Html Отредактировано: НГ-повтора на той же строке, что и директивы, как Ваш вопрос государств.

<div ng-app="test" ng-controller="TestController"> 
    <div my-directive data="item" ng-repeat="item in myDirectiveData"></div> 
</div> 

Answer 2

<div ng-repeat="item in myDirectiveData"> 
    <h1>{{item.title}}</h1> 
    <p>{{item.content}}</p> 
</div>