Управляемая сортировка в angular?

Question

[desuvin]

Столкнулся с задачей, которую никак не могу решить хотя на первый взгляд кажется простой.
Суть следующая: Нужно вывести select в котором будут надписи под тип
"Сортировка по цене по возрастанию"
"Сортировка по цене по убыванию"
"Сортировка по месяцу по возрастанию"

Все это привязано к каком-нибудь scope.sort

И вот главный вопрос. Что написать в самом селекте и что написать в ng-repeat, чтобы можно было кликнув по селекту указать колонку по которой будет искаться, а также desc или asc

Пробовал так:

<select id="select-sort" ng-model="filter.sort" required ng-options="bool.value as bool.name for bool in boolValues"
                    ng-init="boolValues = [{value: {type: 'price', desc: true}, name: 'По возрастанию цены'}, {value: {type: 'price', desc: false}, name: 'По убыванию цены'}, {value: {type: 'm', desc: true}, name: 'По дате заезда'}]; filter.sort={type: 'price', desc: true}">

Но, к сожалению, не работает. Да и не знаю как потом дальше это вставить в ng-repeat

Answer 1

[Сергей Протько]

<div ng-controller="ProductsController as products">
  <select ng-model="products.sort" ng-change="products.updateList()">
  </select>

  <ul>
    <li ng-repeat="item in products.list">{{ item.name }}</li>
  </ul>
</div>

function ProductsController {
   var vm = this;

   vm.sort = 1;
   vm.updateList = updateList;
   updateList();

   function updateList () {
       vm.list = vm.list.sort(function (a, b) {
            // логика сортировки тут
       });
   }
}

p.s. хватит решать проблемы тупо в шаблонах, будет намного проще и меньше боли.

Comments

[desuvin]

Хороший вариант, но уже решил фильтром.

[Сергей Протько]

desuvin: фильтры плохой вариант.

[desuvin]

Сергей Протько: не согласен, получилось красивенько и нет кода в шаблоне. Просто фильтр на ng-repeat, в котором тот же sort. Такой код логичнее держать в фильтре, чем в контроллере. С ангуляром знаком, просто думал, есть какой-то шаблонный вариант решения проблемы

[Сергей Протько]

desuvin: как раз таки нет, в шаблоне не должно быть никаких преобразований данных, это должно происходить вообще в сервисе по запросу контроллера, то что у меня сортировка происходит в контроллере это чисто упрощение.

[helarqjsc]

Сергей Протько: То есть по вашему фильтры в ангуляре (включая встроенные limitTo, lowercase, number, orderBy, date и т.д.) это антипаттерн? Объясните.

[Сергей Протько]

helarqjsc: ну...

1) фильтры можно инджектить в сервисы и юзать там
2) фильтры типа number/date/etc - полезные, так как их можно юзать с bind-once и т.д.
3) использование фильтров в темплейте повышает скорость разработчи и сильно сказывается на производительности, потому я не использую такой подход. Да и как показывает практика, это существенно упрощает поддержку апы если она хоть сколько нибудь большая.

[Сергей Протько]

helarqjsc: ну и да, ангуляр предоставляет кучу разных ништяков, которые являются дурным тоном если их использовать не там где надо. Например я до сих пор помню чудную реализацию обертки над localStorage которая работала исключительно на ватчерах.