在具有多個值的列上使用AngularJS中的$ filter？

來自此鏈接：http://voryx.net/using-angularjs-filter-inside-the-controller/

我期待回來：Object1，Object5，Object8。相反，我什麼也得不到那麼如何使用$ filter過濾出一列中的多個值？

我試着用下面這段代碼：

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>

來源

2016-06-08 Da Best

濾波器可使用的回調：

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

來源

2016-06-08 20:05:36

在具有多個值的列上使用AngularJS中的$ filter？

回答

相關問題