对绑定到 ID 列表的 AngularJS 智能表进行排序答案

【问题标题】：Sorting AngularJS smart-table bound to list of IDs对绑定到 ID 列表的 AngularJS 智能表进行排序
【发布时间】：2015-05-27 10:17:59
【问题描述】：

我有一个 AngularJS 控制器，它检索多个 ID 集合（排序和过滤方式不同）和一个将 ID 映射到实际数据的字典。

我正在尝试使用智能表来显示数据并允许用户对其进行排序和过滤。我在如何使用智能表处理从键到实际数据的间接级别时遇到了麻烦。

在 st-sort 的示例代码中找到的解决方案是使用 getter 函数，但这似乎过于冗长，因为我需要为每个字段单独定义一个 getter 函数。另外，当数组包含标量而不是具有属性的对象时，我没有得到我应该放入 st-sort 的内容。

另外，我不确定智能表的其他部分是否会因为这种间接（如过滤）而出现问题。

我将不胜感激任何有关处理它的最佳方法的建议。

控制器

 angular.module('myApp', ['smart-table'])
    .controller('mainCtrl', ['$scope',
        function ($scope) {

          $scope.ordered_ids = [ 'id-1', 'id-2', 'id-3' ];

          $scope.data = {
              'id-1': {firstName: 'Laurent', lastName: 'Renard', birthDate: new Date('1987-05-21'), balance: 102, email: 'whatever@gmail.com'},
              'id-2': {firstName: 'Blandine', lastName: 'Faivre', birthDate: new Date('1987-04-25'), balance: -2323.22, email: 'oufblandou@gmail.com'},
              'id-3': {firstName: 'Francoise', lastName: 'Frere', birthDate: new Date('1955-08-27'), balance: 42343, email: 'raymondef@gmail.com'}
          };

          $scope.getter=function (value) {
              return $scope.data[value];
          }         

        }
    ]);

HTML

<table st-table="ordered_ids" class="table table-striped">
    <thead>
      <tr>
        <th st-sort="">ID</th>
          <th st-sort="getter">First name</th>
          <th>Last name</th>
        <th>Email</th>
    </tr>
    </thead>
    <tbody>
    <tr ng-repeat="id in ordered_ids" ng-init="e = data[id]">
      <td>{{id}}</td>
        <td>{{e.firstName}}</td>
        <td>{{e.lastName}}</td>
        <td>{{e.email}}</td>
    </tr>
    </tbody>
</table>

Plunker

【问题讨论】：

标签： angularjs smart-table

【解决方案1】：

我认为您应该首先转换数据以使其更易于使用

//assuming $scope.data is the object above

$scope.data = Object.keys($scope.data).map(function(key){
    return angular.extend({id:key},$scope.data[key]);
});

//no you'll have an array [{id:'id-1',fistname:'laurent',lastname:'renard', ...}, ... ]

那么一切都应该更容易

【讨论】：