AngularJS orderBy реверсивный массив вместо его заказа

Question

Когда я нажимаю кнопку «кнопка заказа», вы не заказываете, это всего лишь обратное все td. Например, «A», «C», «B» становится «B», «C», «A». Я действительно не знаю, почему это происходит.

HTML

     <!-- Top section --> 
    <div class="row"> 
     <div class="col-lg-12"><img src="/img/AngularJS.svg" class="img-responsive"></div> 
     <p class="text-center">поиск и сортировка данных</p> 
    </div> 

         <!--Input and buttons--> 
    <div class="container-fluid" > 
     <div class="row-fluid"> 
      <input class="col-md-12 col-xs-12" type="text" placeholder="Search people by name..." ng-model='data.text' ng-pattern='data.regexp'> 

      <div class="buttons"> 
       <button ng-click='data.sortType = "data.students.name"; sortReverse = !sortReverse'class="btn btn-sort">Sort by name</button> 

       <button ng-click='data.sortType = "data.students.age"; sortReverse = !sortReverse' class="btn btn-sort">Sort by age</button> 

       <button ng-click='data.reset()' class="btn btn-danger">Reset</button> 
      </div> 
     </div> 


         <!--Main content--> 
     <div class="main-table col-sm-8 col-md-7 col-md-offset-1 col-lg-7 col-lg-offset-1"> 
      <table class="table table-hover"> 
       <thead> 
        <tr> 
        <th class="text-center">Image</th> 
        <th>Name</th> 
        <th>Age</th> 
        <th>Phone</th> 
        </tr> 
       </thead> 

       <tbody ng-repeat='student in data.students | filter:data.text | orderBy : sortType:sortReverse'> 

        <tr ng-click='data.sideBar(student.img, student.name, student.age, student.phone)'> 

        <td><img ng-src='{{student.img}}'></td> 
        <td>{{student.name}}</td> 
        <td>{{student.age}}</td> 
        <td>{{student.phone}}</td> 
        </tr> 
       </tbody> 
      </table> 
     </div> 
    </div> 

JS

(function(){ 
    var app = angular.module('app', []); 


    app.controller('DataController', function() { 
     this.students = arr; 

     this.regexp = /^[A-z]+$/; 

     this.sideBarImg = '/img/dog.svg'; 
     this.sideBarName = 'Chad Snyder'; 
     this.sideBarAge = 22; 
     this.sideBarPhone = '8 (629) 653-9041'; 

     this.sortType = 'student.age'; 
     this.sortReverse = false; 

     this.reset = function() { 
      this.text = ''; 
     }; 

     this.sideBar = function(img, name, age, phone){ 
      this.sideBarImg = img; 
      this.sideBarName = name; 
      this.sideBarAge = age; 
      this.sideBarPhone = phone; 

     }; 


    }); 

    app.filter('favAnimal', function() { 
     return function(animalName) { 

      animalName = animalName.substring(0, animalName.indexOf('.')); 
      var tmp = animalName.split('/'); 
      var result = tmp[tmp.length - 1]; 

      return result; 
     } 
    }) 


    arr = [ 
     {img: '/img/dog.svg', name: 'Chad Snyder', age: 22, phone: '8 (629) 653-9041'}, 
     {img: '/img/raccoon.svg', name: 'Milton Warner', age: 19, phone: '8 (366) 958-8850'}, 
     {img: '/img/fox.svg', name: 'Viola Hale', age: 35, phone: '8 (687) 456-4873'}, 
     {img: '/img/owl.svg', name: 'Tyler Herrera', age: 27, phone: '8 (537) 867-1647'}, 
     {img: '/img/sheep.svg', name: 'Gabriel Howell', age: 45, phone: '8 (332) 288-8294'}, 
     {img: '/img/cat.svg', name: 'Adelaide Jacobs', age: 32, phone: '8 (609) 383-7022'}, 
     {img: '/img/koala.svg', name: 'James Diaz', age: 21, phone: '8 (262) 812-4095'}, 
     {img: '/img/lion.svg', name: 'Vincent Sparks', age: 21, phone: '8 (475) 497-4172'}, 
     {img: '/img/owl.svg', name: 'Jackson Peterson', age: 23, phone: '8 (838) 992-3015'}, 
     {img: '/img/penguin.svg', name: 'Theresa Schwartz', age: 31, phone: '8 (215) 881-3278'}, 
     {img: '/img/pig.svg', name: 'Charles Carter', age: 39, phone: '8 (719) 862-9379'}, 
     {img: '/img/dog.svg', name: 'Curtis Briggs', age: 70, phone: '8 (255) 719-5400'}, 
     {img: '/img/raccoon.svg', name: 'Mollie French', age: 57, phone: '8 (668) 359-4293'}, 
     {img: '/img/koala.svg', name: 'Maurice Watson', age: 36, phone: '8 (368) 345-7784'}, 
     {img: '/img/lion.svg', name: 'Derrick Hill', age: 42, phone: '8 (413) 435-6719'} 
     ]; 
}()); 

Answer 1

Ваш тип сортировки должен быть имя свойства.

 <button ng-click='sortType = "name"; sortReverse = !sortReverse' class="btn btn-sort">Sort by name</button> 

     <button ng-click='sortType = "age"; sortReverse = !sortReverse' class="btn btn-sort">Sort by age</button> 

Посмотрите на эту JSFiddle мне пришлось ввести $ область, чтобы сделать приложение запуска.