CODEWITHSUNDEEP
angularjsangularjs-filter
On The Net Again
On The Net Again

Reputation: 305

Using $filter in AngularJS on one column with multiple values?

From this link: http://voryx.net/using-angularjs-filter-inside-the-controller/

I expected back: Object1, Object5, Object8. Instead I get nothing. So how do I use $filter to filter out multiple values from one column?

I tried using this code below:

var myAppModule = angular.module('myApp', []);

myAppModule.controller('PageController', ["$scope", "$filter", function($scope, $filter) {
  // sample collection of objects
  var myObjects = [{
    name: "Object1",
    shape: "circle",
    color: "red"
  }, {
    name: "Object2",
    shape: "square",
    color: "orange"
  }, {
    name: "Object3",
    shape: "triangle",
    color: "yellow"
  }, {
    name: "Object4",
    shape: "circle",
    color: "green"
  }, {
    name: "Object5",
    shape: "sphere",
    color: "blue"
  }, {
    name: "Object6",
    shape: "hexagon",
    color: "indigo"
  }, {
    name: "Object7",
    shape: "square",
    color: "violet"
  }, {
    name: "Object8",
    shape: "triangle",
    color: "red"
  }];

  $scope.myRedObjects = $filter('filter')(myObjects, 
    [{color: "red"}, {color: "blue"}]);    
}]);

HTML:

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
<div class='container' ng-app="myApp" ng-controller='PageController'>
  <div class="page-header">
    <h1>AngularJS $filter in Controller <small>Subtext for header</small></h1>
  </div>

  <h5> // return an array with only red objects</h5>
  <code>
  $scope.myRedObjects = $filter('filter')(myObjects, { color: "red" });
  </code>
  <p ng-repeat="mro in myRedObjects">{{mro.name}}</p>
  <p></p>
  <p></p>
  <p>
    code taken from : http://voryx.net/using-angularjs-filter-inside-the-controller/
  </p>
</div>
</body>
</html>

Upvotes: 0

Views: 788

Answers (1)

Gonzalo Pincheira Arancibia
Gonzalo Pincheira Arancibia

Reputation: 3623

Filter may use a callback:

$filter('filter')(myObjects, function(value, index, array){
    if(value.color === 'red' || value.color === 'blue') {
      return true;
    }    
});

Upvotes: 1

Related Questions