Javascript 如何在angular中基于复选框选择筛选结果
我有3个复选框,我想根据选择的复选框筛选我的结果列表。我正在形成一个选择数组,并使用angular应用了过滤器,但当我单击复选框时,结果或列表消失了 HTMLJavascript 如何在angular中基于复选框选择筛选结果,javascript,angularjs,checkbox,filter,angularjs-ng-model,Javascript,Angularjs,Checkbox,Filter,Angularjs Ng Model,我有3个复选框,我想根据选择的复选框筛选我的结果列表。我正在形成一个选择数组,并使用angular应用了过滤器,但当我单击复选框时,结果或列表消失了 HTML })) 看来你把条件写错了,试着改变一下 if(country_exists==false){$scope.selected_country.push(country);} 到 如果(country_exists==true){$scope.selected_country.push(country)}如果您的条件写错了,请尝试更改 if
})) 看来你把条件写错了,试着改变一下
if(country_exists==false){$scope.selected_country.push(country);}
到
如果(country_exists==true){$scope.selected_country.push(country)}
如果您的条件写错了,请尝试更改
if(country_exists==false){$scope.selected_country.push(country);}
到
如果(country_exists==true){$scope.selected_country.push(country);}
该条件很好,尽管我确实更新了函数以使其正常工作过滤器仍然没有被应用,数组push和pop工作正常您可以创建plnk或pen吗?该条件很好,虽然我确实更新了该函数,使其能够正常工作过滤器仍然没有被应用,但数组推送和弹出功能很好。您可以创建plnk或pen吗?
<div class="row" ng-controller="DataCtrl">
<div class="col-sm-4">
<div class="checkbox">
<label>
<input type="checkbox" value="US" ng-click="select('US')">
US
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" value="UK" ng-click="select('UK')">
UK
</label>
</div>
<div class="checkbox">
<label>
<input type="checkbox" value="Australia" ng-click="select('Australia')">
Australia
</label>
</div>
</div>
<div class="col-sm-8">
<div class="well" ng-repeat="eve in events | filter : selected_country">
<h3>{{eve.title}}</h3>
<h5>{{eve.country}}</h5>
</div>
</div>
</div>
refine.controller('DataCtrl', function($scope){
$scope.selected_country = [];
$scope.events = [
{
'title' : 'Global Warming 2016',
'country' : 'US'
},
{
'title' : 'Global Warming 2017',
'country' : 'UK'
},
{
'title' : 'Global Warming 2018',
'country' : 'Australia'
}
];
$scope.select = function(country){
var index = $scope.selected_country.indexOf(country);
var country_exists = (index > -1);
if(country_exists == false){$scope.selected_country.push(country);}
else{ $scope.selected_country.splice(index, 1);}
console.log($scope.selected_country);
}