AngularJS ng-repeat同时使用orderBy与filter无数据显示问题

这问题我之前碰到过，核心原因是你在同一个ng-repeat表达式里用了两个track by $index，这违反了AngularJS的语法规则，直接导致数据无法正常渲染。

错误代码的核心问题 #

你的原代码里同时写了两个track by $index：

<tr ng-repeat="rows in $ctrl.myData | orderBy:$ctrl.sort.active:$ctrl.sort.descending track by $index | filter: {Type:type} track by $index" >

AngularJS规定，track by是ng-repeat表达式的收尾部分，整个表达式只能出现一次。重复的track by会让框架无法正确解析重复项的跟踪逻辑，最终导致表格无数据显示。

修正后的代码 #

把多余的track by $index删掉，只保留在表达式的最后即可：

<tr ng-repeat="rows in $ctrl.myData | orderBy:$ctrl.sort.active:$ctrl.sort.descending | filter: {Type:type} track by $index" >

额外说明 #

• 过滤器的顺序：如果你希望先排序再筛选，当前的orderBy在前、filter在后的顺序是对的；如果需要先筛选再排序，调换两者位置即可。
• track by $index的作用：当你的数据没有唯一标识符（比如id字段）时，用它来跟踪重复项是合理的，但务必确保只出现一次。

这样修改后，排序和筛选就能同时正常工作了。

内容的提问来源于stack exchange，提问作者dadsa