AngularJs orderby過濾器沒有正確排序數據

-1

我有一個客戶數組顯示在HTML中使用ng-repeat從控制器。AngularJs orderby過濾器沒有正確排序數據

這裏我試圖使用orderby過濾器對數據進行排序。但問題是當數組初始化時，它按升序正確排序。但是，當我點擊名稱標題時，它將chnages數據，但不會按預期下降數據。這裏是一個正在運行的plunker：

AngularJs：

app.controller('MainCtrl', function($scope) { 

    $scope.sortIt = "name"; 
    $scope.reverse = false; 

    $scope.customers = [ 
          { 
           name:'AAA', 
           city: 'Dublin', 
           orderTotal: 9.9563, 
           joined: '1947-10-10'}, 
          { 
           name:'CCC', 
           city:'London', 
           orderTotal: 24.999, 
           joined: '2011-08-12'}, 
          { 
           name:'BBB', 
           city:'Kenya', 
           orderTotal: 140.4852, 
           joined: '1981-06-04'}, 
          { 
           name:'DDD', 
           city:'Tokyo', 
           orderTotal: 77.3654, 
           joined: '2006-10-30'} 
         ] 

    $scope.doSort = function(propName) { 
    $scope.sortIt = propName; 

    //changing the value to opposite if true then false, if false then true 
    $scope.reverse = !$scope.reverse; 
    }

HTML：

<table class="table table-striped"> 
     <thead> 
     <tr> 
      <th ng-click="doSort(name)" class="btn-arrange"> 
      Name 
      </th> 
      <th> 
      <span>City</span> 
      </th> 
      <th>Order Total</th> 
      <th>Joined</th> 
     </tr> 
     </thead> 
     <tbody> 
     <tr ng-repeat="c in customers | orderBy: sortIt: reverse"> 
      <td>{{c.name}}</td> 
      <td>{{c.city}}</td> 
      <td>{{c.orderTotal}}</td> 
      <td>{{c.joined}}</td> 
     </tr> 
     </tbody> 
    </table>

來源

2016-04-25 Sam

結果表的問題是什麼？ – niyasc

我想按升序和降序排列名稱，當表初始化名稱正確排序時。但是當我點擊名稱標題時，它不會正確地降下名字！ – Sam

它對我來說工作正常。你以後更新了代碼嗎？ – niyasc

更換$scope.reverse = !scope.reverse;與$scope.reverse = !$scope.reverse;

您之前錯過。

更新：

更換<th ng-click="doSort(name)" class="btn-arrange">與<th ng-click="doSort('name')" class="btn-arrange">

Working Demo

來源

2016-04-25 11:23:51

我已經更新了代碼，現在點擊正在工作。但它仍然沒有按預期的順序排列asc/desc。任何幫助，請！ – Sam

@Sam更新回答。 –

謝謝..可能我有選擇給你5點這個..謝謝 – Sam

我加入這個答案做謂語

<th><a href="" ng-click="predicate = 'name'; reverse=!reverse">Name</a> </th> 
 
<th><a href="" ng-click="predicate = 'city'; reverse=!reverse">City</a> </th> 
 
<th><a href="" ng-click="predicate = 'orderTotal'; reverse=!reverse">Order Total</a></th> 
 
<th><a href="" ng-click="predicate = 'joined'; reverse=!reverse">Joined</a></th> 
 

 
<tr ng-repeat="c in customers | orderBy:predicate:reverse"> 
 
<td>{{c.name}}</td> 
 
<td>{{c.city}}</td> 
 
<td>{{c.orderTotal}}</td> 
 
<td>{{c.joined}}</td>

所有單個標題值排序

來源

2016-04-25 11:49:17 User

AngularJs orderby過濾器沒有正確排序數據

回答

相關問題