AngularJS: сервисный запрос возвращает нулевой результат

мой app.js выглядит так

var app = angular.module('pennytracker', [
  '$strap.directives',
  'ngCookies',
  'categoryServices'
]);

app.config(function($routeProvider) {
  console.log('configuring routes');
  $routeProvider
    .when('/summary', { templateUrl: '../static/partials/summary.html'})
    .when('/transactions', { templateUrl: '../static/partials/transaction.html', controller: 'AddTransactionController' })
});

а мой app/js/services/categories.js выглядит как

angular.module('categoryServices', ['ngResource']).
  factory('Category', function($resource){
    return $resource(
      '/categories/:categoryId',
      {categoryId: '@uuid'}
    );
  });

и у меня есть маршрут как

  .when('/transactions', { templateUrl: '../static/partials/transaction.html', controller: 'AddTransactionController' })

и мой контроллер app/js/controllers/transactionController.js выглядит так

function AddTransactionController($scope, $http, $cookieStore, Category) {
 // some work here
  $scope.category = Category.query();
  console.log('all categories - ', $scope.category.length);
}

Когда я запускаю свое приложение, я вижу console.log как

all categories -  0

Что я здесь делаю не так?


javascript angularjs angularjs-scope angularjs-routing angularjs-service
person daydreamer    schedule 05.05.2013    source источник

Ответы (1)


arrow_upward
15
arrow_downward

Category.query() является асинхронным. Он немедленно возвращает пустой массив и добавляет результат запроса позже, когда приходит ответ — из http://docs.angularjs.org/api/ngResource.%24resource:

Важно понимать, что вызов метода объекта $resource немедленно возвращает пустую ссылку (объект или массив в зависимости от isArray). Как только данные возвращаются с сервера, существующая ссылка заполняется фактическими данными. Это полезный трюк, так как обычно ресурс назначается модели, которая затем визуализируется представлением. Наличие пустого объекта приводит к отсутствию рендеринга, как только данные поступают с сервера, объект заполняется данными, и представление автоматически повторно отображает себя, показывая новые данные.

Если вам нужно получить доступ к результату в вашем контроллере, вы должны сделать это в функции обратного вызова следующим образом:

$scope.category = Category.query(function(){
  console.log('all categories - ', $scope.category.length);
});
person joakimbl    schedule 05.05.2013
comment
господи :(, почему я пропустил эту часть в документации. Большое спасибо @joakimbi, теперь это работает - person daydreamer; 06.05.2013