Josh
Josh

Reputation: 1474

orderBy not filtering numbers correctly

I have an ng-repeat directive.

<tr data-ng-repeat="list in vm.customer.lists | orderBy: list.id track by $index">
    <td>[[list.name]]</td>
    <td>[[list.locations.length]] Location<span data-ng-cloak data-ng-if="list.locations.length !== 1">s</span></td>
    <td><a data-ng-href="/#/locations/manage/list/edit/[[vm.customer.id]]/[[list.id]]" class="button expand">Manage Locations</a></td>
</tr>

I'm repeating 3 lists in vm.customer.lists

I'm trying to accomplish least to greatest by list.id (1, 2, 3, etc.)

Maybe I can't orderBy list?

Upvotes: 0

Views: 46

Answers (2)

Sajeetharan
Sajeetharan

Reputation: 222582

It should be,

<tr data-ng-repeat="list in vm.customer.lists | orderBy: 'id' ">

DEMO

var app = angular.module("app", []);
app.controller("ctrl", function($scope) {
  $scope.customer = 
      [{
      id: 4,
      name: 'sachin'
      
    }, {
      id: 1,
      name: 'Saurav'
     
    }, {
      id: 3,
      name: 'Dravid'
     
    }, {
      id: 2,
      name: 'Dhoni'
    
    }];
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">  
    <li ng-repeat="list in customer | orderBy: 'id' track by $index">
     {{list.name}}
    </li>
 
</div>

Upvotes: 1

Naghaveer R
Naghaveer R

Reputation: 2944

You are missing quotes in filter

<tr data-ng-repeat="list in customer.lists | orderBy: 'id' track by $index">

var app = angular.module("app", []);
app.controller("ctrl", function($scope) {
  $scope.customer = {
    'lists': [{
      id: 4,
      name: 'T',
      locations: []
    }, {
      id: 1,
      name: 'S',
      locations: []
    }, {
      id: 3,
      name: 'R',
      locations: []
    }, {
      id: 2,
      name: 'O',
      locations: []
    }]
  };
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
  <table>
    <tr data-ng-repeat="list in customer.lists | orderBy: 'id' track by $index">
      <td>{{list.name}}</td>
      <td>{{list.locations.length}} Location<span data-ng-cloak data-ng-if="list.locations.length !== 1">s</span>
      </td>
      <td><a data-ng-href="/#/locations/manage/list/edit/[[vm.customer.id]]/[[list.id]]" class="button expand">Manage Locations</a>
      </td>
    </tr>
  </table>
</div>

Upvotes: 0

Related Questions