AngularJS ng-repeat不渲染$ resource

时间:2015-04-24 21:06:52

标签: javascript angularjs angularjs-scope angularjs-ng-repeat angular-ui-router

我正在处理包含用户供稿页面的Angular应用程序,供稿中的一个项目是用户所属的组列表。这些组通过$ resource调用从后端拉出,该调用接受用户id作为参数。

我面临的问题是allGroups($ resource调用返回的集合)在$ scope中可用,但不在页面上呈现。

以下是设置groups变量的控制器:

angular.module('kickitAngularFrontendApp')
  .controller('UserCtrl', function ($timeout, $scope, User, $rootScope) {
    $timeout(function() {
      User.allGroups.query({user_id: $rootScope.user.id}, function(data) {
        $scope.allgroups = data;
      })
    }, 130);
  });

这是用户工厂

angular.module('kickitAngularFrontendApp')
  .factory('User', function ($resource) {
    return {
      allGroups: $resource('http://localhost:3000/api/users/:user_id/get_groups', {
        query: { method: 'GET', params: {}, isArray: false }
      }),
      groupsCreated: $resource('http://localhost:3000/api/users/:id/get_groups_created', {
        query: { method: 'GET', params: {}, isArray: false }
      }),
      allEvents: $resource('http://localhost:3000/api/users/:id/get_events', {
        query: { method: 'GET', params: {}, isArray: false }
      }),
      eventsCreated: $resource('http://localhost:3000/api/users/:id/get_events_created', {
        query: { method: 'GET', params: {}, isArray: false }
      }),
    };
  });

以下是渲染组

的视图
<div class="col-md-3">
  <h3>Group Feed</h3>
  <ul class="list-group" ng-controller="UserCtrl">
    <li class="list-group-item" ng-repeat="group in allGroups"></li>
  </ul>
</div>

我可以看到allGroups对象附加到UserCtrl $ scope并使用ng-inspector查看它,但它不会在页面上呈现。我的想法是因为$ resource请求需要在页面加载后设置的$ rootScope.user对象的id,因此无法呈现它。

如果确实如此,我将如何解决它?非常感谢任何帮助。

另外,如果有帮助,我正在使用Angular ui-router。

0 个答案:

没有答案