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"}] 

я пытаюсь использовать порядок, но как-то does't работать

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