6

我的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 

我在这里做错了什么?

4

1 回答 1

15

Category.query()是异步的。它立即返回一个空数组,并稍后在响应到达时添加请求的结果 - 来自http://docs.angularjs.org/api/ngResource.$resource

重要的是要意识到调用 $resource 对象方法会立即返回一个空引用(对象或数组取决于 isArray)。从服务器返回数据后,现有参考将填充实际数据。这是一个有用的技巧,因为通常将资源分配给模型,然后由视图呈现。拥有一个空对象不会导致渲染,一旦数据从服务器到达,那么该对象就会被数据填充,并且视图会自动重新渲染自身以显示新数据。

如果您需要访问控制器中的结果,您应该在回调函数中执行此操作,如下所示:

$scope.category = Category.query(function(){
  console.log('all categories - ', $scope.category.length);
});
于 2013-05-05T22:02:41.310 回答