Я новичок в Angular.js, и у меня возникли проблемы с сортировкой моего массива и работой с отсортированными данными.
У меня есть список с элементами, и я хочу отсортировать его по "Store.storeName", который пока работает. Но после сортировки данных моя функция удаления больше не работает. Я думаю, это потому, что индекс $ неправильный после сортировки, и поэтому неправильные данные удаляются.
Как я могу это решить? Заказ данных в области действия, а не в представлении? Как это сделать?
Вот соответствующий код:
В представлении:
<tr ng-repeat="item in items | orderBy:'Store.storeName'">
<td><input class="toggle" type="checkbox" ng-model="item.Completed"></td>
<td>{{item.Name}}</td>
<td>{{item.Quantity}} Stk.</td>
<td>{{item.Price || 0 | number:2}} €</td>
<td>{{item.Quantity*item.Price|| 0 | number:2}} €</td>
<td>{{item.Store.storeName}}</td>
<td><a><img src="img/delete.png" ng-click="removeItem($index)">{{$index}}</a></td>
</tr>
И в моем контроллере у меня есть эта функция удаления, которая должна удалять определенные данные:
$scope.removeItem = function(index){
$scope.items.splice(index,1);
}
Это хорошо работает перед заказом в представлении. Если чего-то важного не хватает, позвольте мне сейчас.
Благодарность!
источник
Я начал изучать angular и столкнулся с аналогичной проблемой, и, основываясь на ответе @ pkozlowski-opensource, я решил это просто с помощью чего-то вроде
<a> <img src="img/delete.png" ng-click="removeItem(items.indexOf(item))"> {{items.indexOf(item)}} </a>
источник
У меня была такая же проблема, и другие ответы в этой теме не подходят для моей ситуации.
Я решил свою проблему с настраиваемым фильтром:
angular.module('utils', []).filter('index', function () { return function (array, index) { if (!index) index = 'index'; for (var i = 0; i < array.length; ++i) { array[i][index] = i; } return array; }; });
который можно использовать так:
<tr ng-repeat="item in items | index | orderBy:'Store.storeName'">
а затем в HTML вы можете использовать
item.index
вместо$index
.Этот метод подходит для коллекций объектов.
Пожалуйста, примите во внимание, что этот настраиваемый фильтр должен быть первым в списке всех примененных фильтров (orderBy и т. Д.), И он добавит дополнительное свойство
index
(имя настраивается) в каждый объект коллекции.источник
$scope.items.splice($scope.items.indexOf(item),1);
не будет работать должным образом для повторяющихся элементов.(key, item) in items
и это тоже не работает. (ключ не сохранен в оригинале)Попробуй это:
$scope.remove = function(subtask) { var idx = $scope.subtasks.indexOf(subtask), st = $scope.currentTask.subtasks[idx]; // remove from DB SubTask.remove({'subtaskId': subtask.id}); // remove from local array $scope.subtasks.splice(idx,1); }
Вы можете найти подробное объяснение в этой записи в моем блоге.
источник
В случае, если кому-то нужно использовать
$index
, вы можете дать имя отсортированному / отфильтрованному массиву:<tr ng-repeat="item in sortedItems = (items | orderBy:'Store.storeName') track by $index">
Смотрите мой ответ здесь .
источник
Я бы просто оставил комментарий, но у меня нет «репутации».
Решение mile - именно то, что мне нужно. Чтобы ответить на вопрос pkozlowski.opensource: когда у вас есть вложенные
ngRepeat
s, динамический список (например, где вы разрешаете удаление) или и то, и другое (в моем случае), использование$index
не работает, потому что это будет неправильный индекс для серверной части data после сортировки и использованияngInit
для кеширования значения также не работают, потому что оно не переоценивается при изменении списка.Обратите внимание, что решение mile позволяет настраивать имя присоединенного свойства индекса, передавая параметр
<tr ng-repeat="item in items | index:'originalPosition' | orderBy:'Store.storeName'">
Моя измененная версия:
.filter( 'repeatIndex', function repeatIndex() { // This filter must be called AFTER 'filter'ing // and BEFORE 'orderBy' to be useful. return( function( array, index_name ) { index_name = index_name || 'index'; array.forEach( function( each, i ) {each[ index_name ] = i;}); return( array ); }); })
источник