下划线组通过使用服务器数据

Question

我正在使用带有 Underscore.js 的 Angular.js

我的控制器如下所示：

var facultyControllers = angular.module('facultyControllers', []);
facultyControllers.controller('FacultyListCtrl', ['$scope','FacultyListFactory', function($scope, FacultyListFactory) {
  //Get json from the server using factory
  $scope.speakers = FacultyListFactory.query();

  //GroupBy last name letter for the index
  $scope.groups = _.groupBy($scope.speakers['faculty'], "lastNameStartsWith");
}]);

我的观点是这样的：

<section id="faculty-list">
    <div ng-repeat="(lastNameStartsWith, speakers) in groups">
       <h3 id="{{lastNameStartsWith}}" class="faculty-list-header">{{lastNameStartsWith}}</h3>
       <article class="faculty-list-repeater" ng-repeat="speaker in speakers | filter: facultyFilter | orderBy:'last'">
           <div class="row">
           ...
           <div class="col-xs-10">
               <ul class="faculty-short-detail list-unstyled">
                  <li class="name">{{speaker.displayAs}}</li>
                  ...
               </ul>
           </div>
           </div>
        </article>
    </div>
</section>

来自服务器的 json 格式如下：

{
    "faculty":[
    {displayAs: 'John', lastNameStartsWith: 'A', firstName:'John', age:25, gender:'boy'},
    {displayAs:'Jessie', lastNameStartsWith: 'E', age:30, gender:'girl'},
    {displayAs:'Johanna', lastNameStartsWith: 'F', age:28, gender:'girl'},
    {displayAs:'Joy', lastNameStartsWith: 'F', age:15, gender:'girl'},
    {displayAs:'Mary', lastNameStartsWith: 'G', age:28, gender:'girl'},
    {displayAs:'Peter', lastNameStartsWith: 'L', age:95, gender:'boy'},
    {displayAs:'Sebastian', lastNameStartsWith: 'O', age:50, gender:'boy'},
    {displayAs:'Erika', lastNameStartsWith: 'T', age:27, gender:'girl'},
    {displayAs:'Patrick', lastNameStartsWith: 'V', age:40, gender:'boy'},
    {displayAs:'Samantha', lastNameStartsWith: 'Z', age:60, gender:'girl'}
    ]
};

我遇到的问题是当我执行 console.log($scope.speakers);它做了一个资源，然后阵列在教员之下。如果我将上面的 json 直接放入我的控制器中，而不是 FacultyListFactory.query();我可以运行 $scope.groups = _.groupBy($scope.speakers['faculty'], "lastNameStartsWith");成功地。但是我不能将它直接放入我的控制器中，因为它们有数百个并且它们来自服务器。如果我运行 $scope.groups = .groupBy($scope.speakers['faculty'], "lastNameStartsWith");试图访问服务器我在控制台日志中得到一个对象，但它似乎是空的，我运行了 console.log(.groupBy($scope.speakers['faculty'], "lastNameStartsWith"));

如果我运行 $scope.groups = _.groupBy($scope.speakers, "lastNameStartsWith");我得到未定义，因为数据在 {"faculty":[...]}

我不确定如何从来自 GET 调用的数据中访问键值下的嵌套数组。我需要为这个列表按姓氏字母分组，我一直在努力让它工作几个小时。我不确定为什么“教师”不起作用。请帮忙！谢谢

Answer 1

$scope.groups = _.groupBy(...);应该在query()的成功回调中，以便在返回数据后运行...

$scope.speakers = FacultyListFactory.query(function (data) { 
    $scope.groups = _.groupBy($scope.speakers['faculty'], "lastNameStartsWith"); 
}, function(error) { // error handler });