问题
I am working on filtering with checkboxes, My geojson has a property of status. the status is value looks like this:
status : "Act 3Q99"
or
status : "Fut 3Q99"
I need to filter by "Act" or "Fut". here is my filter:
function StatusFilter() {
return function (territorySubdivisions, typeFilter) {
var filtered = [];
angular.forEach(territorySubdivisions, function (subdivision) {
if (typeFilter.active == true && typeFilter.future == true) {
filtered.push(subdivision);
}
else if (typeFilter.active == true && typeFilter.future == false && subdivision.properties.status == subdivision.properties.status.indexOf('Act') != -1) {
filtered.push(subdivision);
}
else if (typeFilter.future == true && typeFilter.active == false && subdivision.properties.status == subdivision.properties.status.indexOf('Fut') != -1) {
filtered.push(subdivision);
}
});
return filtered;
};
};
here is what I tried.
subdivision.properties.status.indexOf('Act') != -1
It of course is not working. I created a working plunker. I included other orderBy and filtering code to make sure there were no conflicts.
working plunker
<div class="col-xs-3">
<div class="checkbox checkbox-success checkbox-inline">
<input type="checkbox" id="active-checkbox-filter" ng-model="vm.typeFilter.active" ng-change="vm.statusActive('active')">
<label for="active-checkbox-filter"> Active </label>
</div>
</div>
<div class="col-xs-3">
<div class="checkbox checkbox-success checkbox-inline">
<input type="checkbox" id="future-checkbox-filter" ng-model="vm.typeFilter.future" ng-change="vm.statusFuture('future')">
<label for="future-checkbox-filter"> Future </label>
</div>
</div>
回答1:
Your code looks strange. Don't you just need this:
if (typeFilter.active === true && typeFilter.future === true) {
filtered.push(subdivision);
} else if (typeFilter.active === true && typeFilter.future === false && subdivision.properties.status.indexOf('Act') >= 0) {
filtered.push(subdivision);
} else if (typeFilter.future === true && typeFilter.active === false && subdivision.properties.status.indexOf('Fut') >= 0) {
filtered.push(subdivision);
}
?
回答2:
Here's some refactoring of @Mate's answer, primarily to adhere to the "Don't Repeat Yourself" principle:
var active = typeFilter.active;
var future = typeFilter.future;
var status = subdivision.properties.status;
var match = (active && future) ||
(active && !future && status.indexOf('Act') >= 0) ||
(future && !active && status.indexOf('Fut') >= 0);
if (match) {
filter.push(subdivision);
}
Note that once you have the boolean match answer you could just use Array.filter instead to produce your result instead of accumulating the results with .push - it's supported on MSIE 9+, so it'll work on any browser that AngularJS supports, reducing your code above to:
function StatusFilter() {
return function (territorySubdivisions, typeFilter) {
return territorySubdivisions.filter(function(subdivision) {
var active = typeFilter.active;
var future = typeFilter.future;
var status = subdivision.properties.status;
return (active && future) ||
(active && !future && status.indexOf('Act') >= 0) ||
(future && !active && status.indexOf('Fut') >= 0);
});
}
}
来源:https://stackoverflow.com/questions/34419370/how-to-include-a-string-includes-function-inside-a-angular-filter