orderBy不对以下ngRepeat表中的项进行排序

时间:2015-12-04 10:47:22

标签: javascript angularjs

这是表格:

<table class="table table-striped">
  <thead>
    <tr>
      <th class="col-md-1">Name</th>
    </tr>
  </thead>
  <tbody>
    <tr reportrowgroup="" ng-repeat="report in reporttree track by $index | orderBy:sortBy" report="report" rowindex="index" class="ng-scope ng-isolate-scope">
      <td><a href="#">Marcos Dima</a></td>

(etc...)

这是下拉订单:

<select class="pull-right" ng-model="sortBy">
  <option value="createdAt">Sort by: <strong>Date</strong></option>
  <option value="adminRealname">Sort by: <strong>Username</strong></option>
</select>

reporttree(样本)中的内容:

[
  {
    "createdAt": "2015-08-12T13:06:54.901Z",
    "adminRealname": "Marcos Dima",
  },
  {
    "createdAt": "2015-12-12T13:06:54.901Z",
    "adminRealname": "Another name",
  },

(etc...)

但是当我从下拉列表中选择adminRealnamecreatedAt时,没有任何反应。我做错了吗?

修改

该表是一个指令,它位于一个单独的表中。也许这就是问题?

            '  </tr>'+
            '</thead>'+
            '    <tbody>'+
            '     <!-- <tr ng-repeat="report in reporttree track by $index"> -->'+
            '      <tr reportrowgroup ng-repeat="report in reporttree | orderBy:sortBy" report="report" rowindex="index"></tr>'+
            '    </tbody>'+
            '<!-- </div> -->'+
          '</table>'

1 个答案:

答案 0 :(得分:1)

  

track by必须始终是最后一个表达式

您可以阅读here

请参阅工作jsFiddle

var myApp = angular.module('application',[]);

myApp.controller('TestController', function ($scope) {
    $scope.data = [{
        createdAt: "2015-08-15T13:06:54.901Z",
        adminRealname: "Marcos Dima"      
        },{
        createdAt: "2015-12-15T13:06:54.901Z",
        adminRealname: "Another name"     
    }];
});

和HTML

<div ng-controller="TestController as vm">  
        <select class="pull-right" ng-model="sortBy">
            <option value="createdAt">Sort by: <strong>Date</strong></option>
            <option value="adminRealname">Sort by: <strong>Username</strong></option>
        </select>
        <table class="table table-striped">
        <thead>
            <tr>
                <th class="col-md-1">Name</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="dataItem in data | orderBy:sortBy track by $index" report="report">
               <td><a href="#">{{dataItem.adminRealname}}</a></td>
            </tr>
       </tbody>
    </table>
</div>