Сортировка AngularJS по значению поля

Я пытаюсь отсортировать некоторые данные по значению поля.

$scope.testarr = [{"id":"1","name":"coffee"},
                  {"id":"2","name":"tea"},
                  {"id":"3","name":"coffee"},
                  {"id":"4","name":"ice coffee"}]

в html-файле у меня есть поле выбора и 3 варианта: кофе, чай и кофе со льдом,

если я выберу кофе, он должен быть отсортирован так

   $scope.testarr = [{"id":"1","name":"coffee"},
                      {"id":"3","name":"coffee"},
                      {"id":"2","name":"tea"},
                      {"id":"4","name":"ice coffee"}]

если я выберу чай, он должен быть отсортирован так

   $scope.testarr = [
                      {"id":"2","name":"tea"},
                      {"id":"1","name":"coffee"},
                      {"id":"3","name":"coffee"},
                      {"id":"4","name":"ice coffee"}]

я пытаюсь использовать порядок, но почему-то это не работает

<div ng-repeat="item in testarr | orderBy: 'name'">
     {{item.id}} ------ {{item.name}}
</div>

person Community    schedule 19.10.2015    source источник
comment
Консоль показывает ошибку?   -  person Luca Marzi    schedule 19.10.2015
comment
нет ошибок. это не сортирует так, как я хотел   -  person    schedule 19.10.2015
comment
Я думаю, вы хотели отсортировать имя по алфавиту. Вы пытались использовать другой параметр для сортировки списка?   -  person Luca Marzi    schedule 19.10.2015
comment
Итак, если вы выберете кофе, все элементы с именем кофе должны быть первыми, а остальные должны оставаться в том же порядке, верно? Я бы не стал использовать orderBy для этого. Я бы использовал ng-change и сам переставил массив. Ваш код не может работать, поскольку значение, передаваемое в orderBy, всегда одно и то же, каким бы ни был выбор.   -  person JB Nizet    schedule 19.10.2015
comment
да, это именно то, что я хочу JB Nizet. есть ли способ сделать это без перестановки массива   -  person    schedule 19.10.2015
comment
Нет, я бы предпочел создать функцию, которая обрабатывает имя, выбранное пользователем, и возвращает true, если имя является подстрокой (в частности, исходной строкой) общей строки... Затем вы используете эту функцию как условие как ng- показать для каждого элемента списка   -  person Luca Marzi    schedule 19.10.2015
comment
@LucaMarzi это был бы фильтр. Но ОП не хочет отфильтровывать элементы. Если, конечно, вы не используете два цикла, один из которых отображает только принятые элементы, а второй — только отклоненные элементы. Но я бы предпочел сделать это в коде JavaScript и создать новый массив, содержащий элементы в правильном порядке.   -  person JB Nizet    schedule 19.10.2015
comment
спасибо @LucaMarzi, я попробую   -  person    schedule 19.10.2015
comment
@JBNizet хорошо, так что вы также можете использовать эту функцию как значение orderBy. Таким образом, если вы сортируете значения по убыванию, вы сначала получаете элементы с подстрокой кофе.   -  person Luca Marzi    schedule 19.10.2015


Ответы (1)


Кажется, это работает. Убедитесь, что ваш ng-repeat имеет доступ к $scope.testarr (т. е. он объявлен на вашем $scope в правильном контроллере или директиве.

angular.module('app', [])
  .controller('ctrl', function($scope) {
    $scope.testarr = [{
      "id": "1",
      "name": "coffee"
    }, {
      "id": "2",
      "name": "tea"
    }, {
      "id": "3",
      "name": "coffee"
    }, {
      "id": "4",
      "name": "ice coffee"
    }];
  });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app">
  <div ng-controller="ctrl">
    <div ng-repeat="item in testarr | orderBy: 'name'">
      {{item.id}} ------ {{item.name}}
    </div>
  </div>
</div>

person Joey Ciechanowicz    schedule 19.10.2015