AngularJS - 按多个复选框组过滤

时间:2014-01-16 15:10:34

标签: angularjs

我正在寻找一些关于最佳方法的建议:

我有大约5组复选框。列表可能是品牌,型号,颜色,尺寸等。当用户勾选品牌,颜色等时,汽车列表会根据他们的选择进行更新。

该列表是从对数据库的调用生成的,我知道如果列表生成一次作为列表可以在前端完全过滤但是DB预计将增长到超过10,000行,那么这将是相当简单的。那不太理想。

我一开始的想法是每次勾选一个复选框时都会发布到数据库并将结果返回给视图。这适用于一组复选框,但我无法理解如何使用多个复选框组。

这是我的控制器中处理该功能的函数:

$scope.getSelectedBrands = function() {
    $scope.brandsselected = $filter('filter')($scope.brands, {checked: true});  
    var senddata = $filter('filter')($scope.brands, {checked: true});
    $http.post('/brands', senddata).success(function(data, status, response) {
        $scope.cars = data;  
    });        
}

我不知道为每个复选框组使用不同但非常相似的功能是否会有太多意义并且看起来不是很干。目前,每个复选框组(例如品牌)都有自己的URL来发布以返回结果集。此外,由于可以首先勾选任何复选框组中的复选框,因此根据检查的复选框,将从不同的函数返回初始数据。

有没有更好的方法来解决这个问题?我还需要允许用户取消选中一个复选框并再次重新填充列表。

希望这是有道理的。

由于

1 个答案:

答案 0 :(得分:0)

好吧我觉得我接近它是错误的。我需要做的就是创建一个如下所示的函数,并在选中复选框时触发它。它只是调用表单数据。

$scope.getFormdata = function(){
    var formdata = [{
            brands : $filter('filter')($scope.brands, {checked: true}),
            types : $filter('filter')($scope.types, {checked: true})
    }];
    console.log(formdata);
} 

非常直截了当。