Имам проблем с изобразяването на асоциативен масив с необектни стойности с AngularJS. Данни като следните могат да бъдат сортирани с помощта на toArray:
{ key1: { value : data }, key2 : { value : data } }
Но ако искате да сортирате асоциативен масив, който не съдържа обекти като следните, цикълът на дайджест ще продължи да работи, докато получите тази грешка
{ key1: { value : data }, key2 : { value : data } }
- В кода по-долу първата проба показва несортираната версия (по подразбиране).
- Вторият може да сортира, но ключовете се губят (наличен е само $index).
- Третият използва филтъра toArray от http://ngmodules.org/modules/angular-toArrayFilter и успява да сортира масива и да запази ключовете, но извежда грешка, защото дайджестът продължава да работи.
- Последният е като третия, но сортира асоциативен масив, съдържащ обекти (което няма да изведе грешка).
angular.module('app', ['angular-toArrayFilter']);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://raw.githubusercontent.com/petebacondarwin/angular-toArrayFilter/master/toArrayFilter.js"></script>
<div ng-app="app" ng-init="items = {a:'A', d:'D', c:'C', b:'B'}; items2 = {a:{value:'A'}, d:{value:'D'}, c:{value:'C'}, b:{value:'B'}}; ">
Normal iteration (unsorted - depending on browser)
<ul>
<li ng-repeat="(key, value) in items">{{ key }} = {{ value }}</li>
</ul>
Sorted iteration (sorted, but no access to key)
<ul>
<li ng-repeat="item in items | orderBy track by item">{{ $index }} = {{ item }}</li>
</ul>
Sorted iteration (works, but throws error)
<ul>
<li ng-repeat="item in items | toArray | orderBy : '$key' track by item.$key">{{ item.$key }} = {{ item.$value }}</li>
</ul>
Sorted iteration with objects (works only with objects)
<ul>
<li ng-repeat="item in items2 | toArray | orderBy : '$key' track by item.$key">{{ item.$key }} = {{ item.value }}</li>
</ul>
</div>
Знам решения като https://stackoverflow.com/a/20446557/2628232, използващи memoize
на долната черта, но искам да избягвам правейки това. В зависимост от отговорите тук, мисля, че това трябва да се докладва като проблем на AngularJS, за да може да се вгради подходящо решение.