Question

目前我正按国家/地区过滤产品。我有复选框的国家/地区列表，但我不知道如果有人选择复选框或取消选择它，如何正确获取所有ID。可以选择多个复选框。

这是我的HTML

<!--checkboxes-->
<fieldset class="m_bottom_15">
  <legend class="default_t_color f_size_large m_bottom_15 clearfix full_width relative">
    <b class="f_left">Filter by: country</b>
  </legend>
<span ng-repeat="c in countries">
   <input type="checkbox" ng-click="filter()" value="{{c.id_country}}" id="{{c.id_country}}"
   class="d_none"><label for="{{c.id_country}}">{{c.country}}</label><br>
</span>
</fieldset>

这是我的控制器

controllers.products = function($scope, categoriesFactory, productsFactory, countriesFactory, $routeParams){
    var cat = $routeParams.param1;
        productsFactory.getProductsInCategory($scope.subCategoryId).then(function(data){
            $scope.products = data;
        });
        countriesFactory.getCountriesList().then(function(data){
            $scope.countries = data.data;
        })
    }).error(function(e){
        console.log(e);
    });
    //Filter products by country ids
    //Don't know how to proceed!!
    $scope.filter = function(id){
        console.log(id);
    }
}

我的目标是只要点击一下复选框就可以获取所有选中的复选框，并将其存储在某个json对象或数组中，这样我就可以在api中使用它。如果您需要任何其他信息，请告诉我，我会提供。

Answer 1

您需要将ngModel指令与<input type=checkbox>元素绑定。也可以使用ngChange代替ngClick。请参阅：https://docs.angularjs.org/api/ng/input/input%5Bcheckbox%5D

例如：

<input type="checkbox" ng-change="filter()" ng-model="selectedCountries[c.id_country]">

然后在你的控制器中：

$scope.selectedCountries = {};

$scope.filter = function() {
    console.log(selectedCountries);
}

选择一个复选框或取消选择一个复选框时，获取所有选中复选框的ID

1 个答案: