orderBy 후 Angularjs가 잘못된 $ index

orderBy 후 Angularjs가 잘못된 $ index

---

저는 Angular.js를 처음 사용하며 배열을 정렬하고 정렬 된 데이터를 작업하는 데 몇 가지 문제가 있습니다.

항목 목록이 있고 지금까지 작동하는 "Store.storeName"별로 정렬하고 싶습니다. 그러나 데이터를 정렬 한 후 삭제 기능이 더 이상 작동하지 않습니다. 정렬 후 $ index가 잘못되어 잘못된 데이터가 삭제 되었기 때문이라고 생각합니다.

어떻게 해결할 수 있습니까? 보기가 아닌 범위에서 데이터를 정렬합니까? 그렇게하는 방법?

다음은 관련 코드입니다.

보기에서 :

<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);
    }

이것은보기에서 주문하기 전에 잘 작동합니다. 중요한 것이 없으면 지금 알려주십시오.

감사!

---

대신 또는 $index-당신이 알고 있듯이-정렬 / 필터링 된 배열의 인덱스를 가리키는 릴레이를 사용 하면 항목 자체를 removeItem함수에 전달할 수 있습니다.

<a><img src="img/delete.png" ng-click="removeItem(item)">{{$index}}</a>

다음과 같이 배열 메서드를 removeItem사용하여 인덱스를 찾기 위해 함수를 수정합니다 indexOf.

$scope.removeItem = function(item){
   $scope.items.splice($scope.items.indexOf(item),1);
}

---

나는 각도를 배우기 시작했고 비슷한 문제에 직면했고 @ 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.

이 방법은 개체 컬렉션에 적합합니다.

Please, take into account that this custom filter should be the first one in the list of all filters applied (orderBy etc.) and it will add the additional property index (the name is customizable) into the each object of the collection.

---

Try this:

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

}

You can find verbose explanation in this entry in my blog.

---

I would've just left a comment, but I don't have the "reputation".

mile's solution is exactly what I needed too. To answer pkozlowski.opensource's question: when you have either nested ngRepeats, a dynamic list (e.g. where you allow removals), or both (which is my case), using $index does not work because it will be the wrong index for the back-end data after sorting and using ngInit to cache the value does not work either because it's not re-evaluated when the list changes.

Note that mile's solution allows for the attached index property name to be customized by passing a parameter <tr ng-repeat="item in items | index:'originalPosition' | orderBy:'Store.storeName'">

My tweaked version:

.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 );
    });
})

---

In case someone needs to use $index, you can give a name to the sorted / filtered array :

<tr ng-repeat="item in sortedItems = (items | orderBy:'Store.storeName') track by $index">

See my answer here.

참고URL : https://stackoverflow.com/questions/16118762/angularjs-wrong-index-after-orderby