 <p>You probably want something like this:</p> <pre><code>.factory('countries', function($http){ var list = []; $http.get('../test.json').success(function(data, status, headers) { angular.copy(data, list); }) return { list: list } }; </code></pre> <p>Then you can bind to the list like this:</p> <pre><code>.controller('View2Ctrl', function ($scope, countries){ $scope.countries = countries.list; }); </code></pre> <p>An alternative, equally valid approach is this:</p> <pre><code>.factory('countries', function($http){ return { list: function() { return $http.get('../test.json'); } } }; </code></pre> <p>Then in your controller: </p> <pre><code>.controller('View2Ctrl', function ($scope, countries){ $scope.countries = []; countries.list().success(function(data) { $scope.countries = data; }); }); </code></pre> <p>Remember that <code>$http.get('../test.json')</code> is already a promise, which is why you can return it without any unnecessary promise/resolve handling. </p>