Angularjs在循环中拼接

时间:2015-04-08 08:24:31

标签: javascript json angularjs

我正在构建这个angularjs应用程序,这是我的第一个应用程序。如此巨大的学习曲线。我似乎无法删除项目以及我的搜索不起作用。我设法让列排序和分页工作。

我没有错误,所以我不确定为什么搜索和删除表格中的项目行无效。

我尝试过使用它:

       $scope.remove = function(client){
            for(var i = $scope.clients.length - 1; i >= 0; i--){
                if($scope.clients[i].name == client.name){
                        $scope.clients.splice(i,1);
                }
            }
        }

工作示例:http://plnkr.co/edit/f2ozbP4JxrRSvRGJAmQi

答案,工作:

谢谢@DTing

  $scope.remove = function(client){
      $scope.filteredItems = $scope.filteredItems.filter(function(item) {
        return item.name !== client.name;
      });
      $scope.groupToPages();
    }

2 个答案:

答案 0 :(得分:2)

这应该是你的删除功能:

        $scope.remove = function(client){
            for(var i = $scope.pagedItems[$scope.currentPage].length - 1; i >= 0; i--){
                if($scope.pagedItems[$scope.currentPage][i].name == client.name){
                    $scope.pagedItems[$scope.currentPage].splice(i,1);
                    break;
                }
            }
        }

这应该是你的搜索功能(注意创建$ scope.clientsCopy):

        $scope.clientsCopy = angular.copy(data);

        $scope.searchMatch = function (haystack, needle) {
            if (!needle) {
                return true;
            }
            return haystack.toLowerCase().indexOf(needle.toLowerCase()) !== -1;
        };

        // init the filtered items
        $scope.search = function () {
            $scope.filteredItems = $filter('filter')($scope.clientsCopy, function (item) {
                for(var attr in item) {
                    if ($scope.searchMatch(item.name, $scope.query))
                        return true;
                    }
                    return false;
                }
            );
            // take care of the sorting order
            if ($scope.sortField !== '') {
                $scope.filteredItems = $filter('orderBy')($scope.filteredItems, $scope.sortField, $scope.reverse);
            }
            $scope.currentPage = 0;
            // now group by pages
            $scope.groupToPages();
        };

Plunker

答案 1 :(得分:1)

您正在尝试更改实际为空的$scope.clients,因为在groupToPages函数中,您将其设置为空数组并重新填充或使用它。

$scope.groupToPages = function () {
        $scope.clients = [];

您可以通过从filteredItems数组中删除项目来使其工作。

$scope.remove = function(client){
  $scope.filteredItems.splice($scope.filteredItems.indexOf(client),1);
  $scope.groupToPages();
}

http://plnkr.co/edit/z9NxW2FgYDlgLB20daO9?p=preview