Блог

Пожалуйста, обратитесь к ссылке ниже

http://codepen.io/anon/pen/fjkcg

HTML:

 <section ng-app="app" ng-controller="MainCtrl">
  <span class="label">Ordered By: {{orderByField}}, Reverse Sort: {{reverseSort}}</span><br><br>
  <table class="table table-bordered">
    <thead>
      <tr>
        <th>
          <a href="#" ng-click="orderByField='firstName'; reverseSort = !reverseSort">
          First Name <span ng-show="orderByField == 'firstName'"><span ng-show="!reverseSort">^</span><span ng-show="reverseSort">v</span></span>
          </a>
        </th>
        <th>
          <a href="#" ng-click="orderByField='lastName'; reverseSort = !reverseSort">
            Last Name <span ng-show="orderByField == 'lastName'"><span ng-show="!reverseSort">^</span><span ng-show="reverseSort">v</span></span>
          </a>
        </th>
        <th>
          <a href="#" ng-click="orderByField='age'; reverseSort = !reverseSort">
          Age <span ng-show="orderByField == 'age'"><span ng-show="!reverseSort">^</span><span ng-show="reverseSort">v</span></span>
          </a>
        </th>
      </tr>
    </thead>
    <tbody>
      <tr ng-repeat="emp in data.employees|orderBy:orderByField:reverseSort">
        <td>{{emp.firstName}}</td>
        <td> <input type="text"
                    ng-init="empx['name_' $index]=emp['lastName']" 
          ng-model="empx['name_' $index]"/> </td>
        <td>{{emp.age}}</td>
      </tr>
    </tbody>
  </table>
</section>
  

Контроллер:

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

app.controller('MainCtrl', function($scope) {
  //$scope.orderByField = 'firstName';
  $scope.reverseSort = false;
  $scope.empx={};
  $scope.data = {
    employees: [{
      firstName: 'John',
      lastName: 'F',
      age: '6703114'
    },{
      firstName: 'Frank',
      lastName: 'D',
      age: '665087589'
    },{
      firstName: 'Sue',
      lastName: 'F',
      age: '5271761234'
    },
               {
      firstName: 'Sue',
      lastName: 'F',
      age: '52'
    },{
      firstName: 'Sue',
      lastName: 'F',
      age: '2334564564564564564'
    }]
  };
});
  

У нас есть элементы управления текстовыми полями и элементы управления датами внутри ng-repeat. когда я выполняю фильтр по фамилии, который не сортируется должным образом. как я могу отсортировать коллекцию, которая находится внутри элементов управления. Сортировка по возрасту и фамилии не работает, сортировка по фамилии не работает, поскольку значение находится внутри элемента управления текстового поля, а возраст не работает из-за большого числа, но оно было обозначено как строка. как я могу добиться правильной работы сортировки во всех случаях.

Я думаю, это потому, что ng-init . Вы никогда не должны использовать ng-init, за исключением вложенных ng-повторов.

Попробуйте удалить ng-init и использовать клон (или оригинал) данных ваших сотрудников напрямую —

 empx = data.employees.map(item => angular.extend({}, item));
  

и выполните итерацию по empx, используя ng-model="item.lastName" in template