how to include a “string includes” function inside a angular filter

霸气de小男生 提交于 2019-12-12 03:15:36

问题


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

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!