angularjs - 智能表“st-sort”不起作用

Question

我正在使用角度 v1.3.15。我通过点击一个api来获取数据并将其通过范围传递给智能表，就像这样

这是控制台上看到的“scope.rowCollection”的数据格式

数据填充得很好，但是当我尝试单击表头并使用 st-sort 方法对其进行排序时，表值显然会变为空白，而不是对列进行排序。这是我的 html 片段的视图

你能告诉我我到底做错了什么。当我使用我自己的数据收集集（非硬编码）时，整个表的值就乱了套。我感觉这与我在角端使用的变量名有关。非常感谢任何帮助....谢谢

Answer 1

按照您的评论 Nikhil。像这样使用st-safe-src：

HTML

<table st-table="displayedCollection" st-safe-src="rowCollection">
      <thead>
        <tr>
          <th st-sort="firstName">First Name</th>
          <th st-sort="lastName">Last Name</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="row in displayedCollection">
          <td>{{row.firstName}}</td>
          <td>{{row.lastName}}</td>
        </tr>
      </tbody>
</table>

JS

app.controller('Ctrl', function($scope, service) {
    $scope.displayedCollection = [];

    service.all.then(function(list) {
        $scope.rowCollection = list;
        $scope.displayedCollection = list;
    });
});

而已。

Answer 2

如果您异步引入数据（来自远程数据库、restful 端点、ajax 调用等），您必须使用 stSafeSrc 属性。您必须对基本集合和安全集合使用单独的集合，否则您可能会陷入无限循环。

由于我从 st-table="displayedCollection" st-safe-src="rowCollection" 获取数据，解决了我的问题

Answer 3

我认为它正在尝试以您对其进行编码的方式对 row.name 进行排序。尝试以下操作，看看它是否有效：

     st-sort="employee.name"