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

Question

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

$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>

Answer 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>