Beispiel
Zeigen Sie die Elemente, die den Buchstaben "A" enthält:
<div ng-app="myApp" ng-controller="arrCtrl">
<ul>
<li ng-repeat="x
in cars | filter : 'A'">{{x}}</li>
</ul>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('arrCtrl',
function($scope) {
$scope.cars = ["Aston Martin",
"Audi", "Bentley", "BMW", "Bugatti"];
});
</script> Versuch es selber " Definition und Verwendung
Der filter Filter ermöglicht es uns , ein Array zu filtern, und ein Array zurück nur die passenden Teile enthält.
Dieser Filter kann nur für Arrays verwendet werden.
Syntax
{{
arrayexpression | filter : expression :
comparator }}Parameterwerte
| Value | Description |
|---|---|
| expression | The expression used when selecting
items from the array. The expression can be of type: String: The array items that match the string will be returned. Object: The object is a pattern to search for in the array. Example: {"name" : "H",
"city": "London"} will return the array items with a name
containing the letter "A", where the city contains the word "London". See
example below.Function: A function which will be called for each array item, and items where the function returns true will be in the result array. |
| comparator | Optional. Defines how strict the comparison should be. The value can be: true : Returns a match only if the value of the array item is exactly what we compare it with. false : Returns a match if the value of the array item contains what we compare it with. This comparison is not case sensitiv. This is the default value. function : A function where we can define what will be considered a match or not. |
Mehr Beispiele
Beispiel
Verwenden Sie ein Objekt als Filter:
<div ng-app="myApp" ng-controller="arrCtrl">
<ul>
<li ng-repeat="x
in customers | filter : {'name' : 'O', 'city' : 'London'}">
{{x.name + ", " + x.city}}
</li>
</ul>
</div>
<script>
var app =
angular.module('myApp', []);
app.controller('arrCtrl', function($scope) {
$scope.customers = [
{"name" :
"Alfreds Futterkiste", "city" : "Berlin"},
{"name" : "Around the Horn", "city" : "London"},
{"name" : "B's Beverages", "city" : "London"},
{"name" : "Bolido Comidas preparadas", "city" : "Madrid"},
{"name" : "Bon app", "city" : "Marseille"},
{"name" : "Bottom-Dollar Marketse" ,"city" : "Tsawassen"},
{"name" : "Cactus Comidas para llevar", "city" : "Buenos Aires"}
];
});
</script>
Versuch es selber " Beispiel
Führen Sie eine "strenge" Vergleich, der keine Übereinstimmung zurück , wenn der Wert genau der gleiche wie der Ausdruck ist:
<div ng-app="myApp" ng-controller="arrCtrl">
<ul>
<li ng-repeat="x
in customers | filter : 'London' : true">
{{x.name + ", " + x.city}}
</li>
</ul>
</div>
<script>
var app = angular.module('myApp',
[]);
app.controller('arrCtrl', function($scope) {
$scope.customers = [
{"name" : "London Food", "city" : "London"},
{"name" : "London Catering",
"city" : "London City"},
{"name" : "London Travel", "city" : "Heathrow,
London"}
];
});
</script>
Versuch es selber " Verwandte Seiten
AngularJS Tutorial: Angular Filter