AngularJS End User Filter multiple values Revised

Question

Got a follow up question for a answer I received earlier.

The answer to the first question, here: AngularJS End User Filter multiple values

The follow up question, that I did not realize when I first asked, is what about multiple types for one product. Fidde: http://jsfiddle.net/ellenburgweb/btpm13m4/2/

<div ng-app ng-controller="Main">
<input type='checkbox' ng-model='Food' ng-true-value="Food" ng-false-value="" />Food
<br />
<input type='checkbox' ng-model='Furniture' ng-true-value="Furniture" ng-false-value="" />Furniture
<br />
<input type='checkbox' ng-model='Fences' ng-true-value="Fences" ng-false-value="" />Fences
<br />
<hr />
<div ng-repeat="product in products | filter:search | filter: productType">
{{product.name}} | {{product.type}}
</div>
</div>

function Main($scope){
$scope.products = [{name: 'Product One', type: 'Food'},
                {name: 'Product Two', type: 'Furniture,Fence'},
                {name: 'Product Three', type: 'Fences'},
                {name: 'Product Four', type: 'Food,Furniture'},
                {name: 'Product Five', type: 'Furniture'},
                {name: 'Product Six', type: 'Fences'}];

$scope.productType = function(product)  {
     var filters = []
     filters.push($scope.Food)
     filters.push($scope.Furniture)
     filters.push($scope.Fences)
     if (filters.toString().length <=4) {return true} 
     else {return filters.indexOf(product.type)>-1 }
}
}

Mike Feltman · Accepted Answer · 2017-06-16 16:19:27Z

1

I posted an update codepen here: http://jsfiddle.net/ezuq4soc/

The productType function looks like this now:

 $scope.productType = function(product) {
    var filters = []
    filters.push($scope.Food)
    filters.push($scope.Furniture)
    filters.push($scope.Fences)
    if (filters.toString().length <= 3) {
      return true
    } else {
      var types = product.type.split(",")
      var match = false
      types.some(function(curType) {
        match = filters.indexOf(curType.trim()) > -1
        return match
      })
      return match
    } 
  }

answered Jun 16, 2017 at 16:19

Mike Feltman

5,1721 gold badge19 silver badges39 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

AngularJS End User Filter multiple values Revised

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related