0

我已经构建了一个与 AngularJS 教程中的非常相似的测试应用程序，但有一个主要区别：它是用 Yeoman 初始化的。

我的工厂代码如下所示：

var deClashServices = angular.module('deClashServices', ['ngResource']);

deClashServices.factory('Session', 
  ['$resource',
  function ($resource) {
    return $resource('views/sessions.json');
  }]
);

是的，angular-resource.js 已添加到 index.html。以及我的控制器和服务 js 文件。是的，deClashServices 已被列为对 ng-app 的依赖项，如我的 app.js 中所示：

var declashAngularApp = angular.module('declashAngularApp', [
  'ngRoute',

  'deClashServices',
  'deClashControllers'
]);

declashAngularApp.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider
      .when('/', {
        templateUrl: 'views/main.html',
        controller: 'MainCtrl'
      })
      .when('/sessions', {
        templateUrl: 'views/sessions.html',
        controller: 'SessionListCtrl'
      })
      .otherwise({
        redirectTo: '/'
      });
  }]);

这是我的控制器：

var deClashControllers = angular.module('deClashControllers', []);

deClashControllers.controller('MainCtrl', 
    ['$scope', 'Session', 
    function ($scope, Session) {
        $scope.sessions = Session.query();
        $scope.awesomeThings = [
          'HTML5 Boilerplate',
          'AngularJS',
          'Karma'
        ];
    }]
);

in main.html，即 under MainCtrl，{{awesomeThings}}按预期生成 3 个字符串的数组。但是{{sessions}}会产生一个空数组。

为了确定是 .query() 没有加载它，我尝试使用带有简单 JSON 文件的工厂：{"sessions":"number1"}

deClashServices.factory('Session', 
  ['$resource',
  function ($resource) {
    return $resource('views/simple.json');
  }]
);

我的控制器是这样的：

deClashControllers.controller('MainCtrl', 
    ['$scope', 'Session', 
    function ($scope, Session) {
        $scope.sessions = {};
        Session.get(function(response) {
            $scope.sessions = response.sessions;
        });
        $scope.awesomeThings = [
          'HTML5 Boilerplate',
          'AngularJS',
          'Karma'
        ];
    }]
);

此代码有效。但是，切换回 JSON 数组并尝试使用回调.query.$promise.then(callback-function)不起作用。

我现在非常迷茫和困惑，因为来自 AngularJS 的教程代码具有几乎完全相同的结构。

我怀疑我使用的方式有问题.query()，但同时 Angular 教程使用了相同的方式并且那里没有问题。

以防它可能超出我展示的几个代码片段，这里是整个项目的代码： github

4

1 回答 1

0

Angular 的资源服务不返回承诺。它返回一个空对象，以便当请求从服务器返回时，资源服务可以使用获取的数据填充该对象，因为它具有对该对象的引用。

所以如果你想对返回的数据做出反应，你必须使用回调函数，或者更好地使用 $http-service，因为它返回承诺。

看看这个plkr

我还建议你看看Restangular

于 2014-01-25T12:54:44.623 回答