title: How to use ng-repeat inside a directive template Angular JS
body: <p>I have a problem displaying the JSON object data that my controller passes to the directive template. Here's my code.</p>
  
  <p><strong>Directive</strong></p>
  
  <pre><code>app.directive('heroes', function(){
      return{
          scope:{
              heroes: '='
          },
          template: '&lt;li ng-repeat="x in hereos"&gt;{{ x.Name }} &lt;/li&gt;', // DOESNT WORK
          link:function(scope,element,attributes){
  
              });
          }
      }
  });
  </code></pre>
  
  <p><strong>Controller</strong></p>
  
  <pre><code>app.controller('MainController',function($scope, $http){
      $scope.getData = function(){
            $http({
                url: 'js/directives/herolist.php',
                method: "GET"
          }).success(function (data) { $scope.heroes = data.records; })
  
      }
  </code></pre>