 <p>I'd give this a shot http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"> </p> <pre><code>&lt;script&gt; var app = angular.module('myApp', []); app.controller('customersCtrl', function($scope, $http) { $http.jsonp("http://localhost/json/customer.php?callback=JSON_CALLBACK") .success(function (response) { $scope.simo = response.data; console.log($scope.simo) }); }); app.directive('display',function(){ return { restrict: 'E', scope: { simo: '=' }, template: '&lt;li ng-repeat="x in simo"&gt;{{ x.Name + ', ' + x.Country }}&lt;/li&gt;' }; }); &lt;/script&gt; </code></pre> <p>Not sure if your intent was to pass the entire response object to the directive, but response.data is the location of what you're likely expecting back from the ajax call.</p> <p>Aside from that I would make sure that your object structure is correct. Or if you're returning an array that you set that flag in the $http call.</p>