如何替换使用ng-repeat显示的数组中的对象?

gus*_*per 15 javascript angularjs angularjs-ng-repeat

我有一个项目数组,使用ng-repeat显示在表格中.当您单击某个项目时,该项目将从服务器中提取,然后应使用更新的项目更新该表格.

单击表格中的项目时获取更新项目的功能:

$scope.getUpdatedItem = function(item){
    itemService.getItem(item).then(
        function(updatedItem){
            item = updatedItem;
        },
        function(error){
            //Handle error
        }
    );
};
Run Code Online (Sandbox Code Playgroud)

我正在使用以下方式显示项目:

<tr ng-repeat="item in myItems">
Run Code Online (Sandbox Code Playgroud)

问题:表中的项永远不会更新.

更新ng-repeat中项目的最佳方法是什么?我可以在ng-repeat中使用"追踪$ index"吗?或者我是否必须迭代myItems才能找到我要替换的项目?

更新:

可能的解决方案是使用而不是使用

item = updatedItem,

使用:

var index = $scope.myItems.indexOf(item);
$scope.myItems[index] = updateItem;
Run Code Online (Sandbox Code Playgroud)

但是,我觉得应该采用"更清洁"的方式来做到这一点.

ela*_*con 14

没有更清洁的方式(然后你的更新).正如您所注意到的,当您更改item回调函数时,您更改了本地引用,而不是更改数组中的原始项.

您可以使用$indexfrom 来改善这一点ng-repeat,而不是自己计算:

<div ng-click="getUpdatedItem(item, $index)"> </div>
Run Code Online (Sandbox Code Playgroud)

在你的控制器中:

$scope.getUpdatedItem = function(item, index){
    itemService.getItem(item).then(
    function(updatedItem){
        $scope.myItems[index] = updateItem;
    },
    function(error){
        //Handle error
    }
    );
};
Run Code Online (Sandbox Code Playgroud)

您也可以使用,angular.copy但效率低得多:

function(updatedItem){
    angular.copy(updateItem, item);
},
Run Code Online (Sandbox Code Playgroud)