Question

我的$scope.clients中有一个客户列表，我使用ng-repeat来显示。

<tr ng-repeat="client in clients">
   <td class="l-h-3x">{{client.name}}</td>
   <td class="l-h-3x p-t-md text-right">
       <button type="button" ng-click="deleteUser($index)>Delete</button>
   </td>
</tr>

现在，如果我删除列表中的最后一个client，它会完美地运行，它会从我的数据库中删除它并将其从$scope.clients中删除。当我删除不是最后一个client的任何client时，问题就出现了。它从我的数据库中删除了正确的$scope.clients，并将其从我的clients中删除，但随后它隐藏了下面的所有剩余$scope.clients [ {id: 1, name: 'Adam'}, {id: 2, name: 'Nadja'}, {id: 3, name: 'Marc'}, {id: 4, name: 'Casper'}]。

Fx的。

client

我删除id = 3 client其中id = 2的工具就像一个魅力，但当我删除client id = 3时，它会从我的数据库中删除它并将其从范围，但也隐藏id = 4 client和$http.delete(api.getUrl('user', person_to_delete.id), { user: $scope.user }) .success(function(data, status, headers, config) { $scope.clients.splice(idx, 1); }) .error(function(data, status, headers, config) { });。

以下是我目前用来删除client

的功能

client

在审核了我的问题后（在你的输入的帮助下）我发现了一些愚蠢的错误（对不起），我现在已经更新了我的帖子，但我仍然有同样的问题。它仍然隐藏{{1}} 3＆amp; 4，删除{{1}} 2

后

Answer 1

此处并非真正理解使用for的目的。在第一个splice之后，数组中的索引被移位，这就是为什么索引之后的所有项都被删除了。

您可以直接使用splice，因为您知道正确的元素索引。

此外，您可以使用$http服务返回的承诺功能，请参阅下面的示例：

$http.delete(api.getUrl('user', person_to_delete.id), {
    user: $scope.user
})
.success(function(data, status, headers, config) {
    // this callback will be called asynchronously
    // when the response is available 
    $scope.clients.splice(idx, 1);
})
.error(function(data, status, headers, config) {
    // called asynchronously if an error occurs
    // or server returns response with an error status.
});

Answer 2

不详细说明您的代码，请查看此内容 fiddle我是从它建造的。看起来它符合您的预期。

<html ng-app="clientsApp">
<head>
    <script src="https://code.angularjs.org/1.3.14/angular.min.js"></script>
    <script>
    var app = angular.module("clientsApp", []);
    app.controller("clientsCtrl", function($scope) {
        $scope.clients = [
        {id: 1, name: 'Adam'},
        {id: 2, name: 'Nadja'},
        {id: 3, name: 'Marc'},
        {id: 4, name: 'Casper'}];

        $scope.deleteUser = function(idx) {
        var person_to_delete = $scope.clients[idx];

            for (var i = $scope.clients.length; i--;) {
                var user = $scope.clients[i];
                if ($scope.clients.indexOf(user) == idx) {
                    $scope.clients.splice(i, 1);
                }
            }
        };
    });
    </script>
</head>
<body ng-controller="clientsCtrl">
    <table>
        <tr ng-repeat="client in clients">
            <td class="l-h-3x">{{client.name}}</td>
            <td class="l-h-3x p-t-md text-right">
                <button type="button" ng-click="deleteUser(clients.indexOf(client))">Delete</button>
            </td>
        </tr>
    </table>
</body>
</html>

Answer 3

我认为问题可能在for循环中。

for (var i = $scope.clients.length; i--;) {
    var user = $scope.clients[i];
    if (clients.indexOf(user) == idx) {
        $scope.clients.splice(i, 1);
    }
}

您从$ scope.clients列表的末尾循环，然后向后移动，将每个$ scope.client与其他客户列表中的每个客户端进行比较，尝试找到匹配的客户端。

如果找到匹配的那个，那么你问'客户'列表中的客户端是否恰好与点击它时$ scope.clients列表中的客户端位于相同的索引位置，最后如果是是真的，然后将它从列表中拼接出来。

为什么有必要？

你已经拥有了被点击的项目的索引位置（来自函数参数），为什么不直接在splice调用中使用它？

$scope.clients.splice(idx, 1);

从范围中删除对象时，它会隐藏Angularjs中的其余对象

3 个答案: