Latest web development tutorials

filtre AngularJS

Les filtres peuvent utiliser un caractère pipe (|) pour ajouter les expressions et les instructions.


filtre AngularJS

AngularJS filtre peut être utilisé pour convertir les données:

filtre description
monnaie numéros de format formatés en tant que monnaie.
filtre Sélection d'un sous-ensemble d'éléments du tableau.
minuscule Format chaîne en minuscules.
orderBy Dispositif de réseau selon une expression.
majuscule Format chaîne en majuscules.

Ajouter un filtre Expressions

Filtrer à travers un caractère pipe (|), et un filtre est ajouté à l'expression. .

((Deux exemples ci-dessous, nous allons utiliser la section précédente mentionné les contrôleurs de personne))

chaîne de filtre majuscules formaté en majuscules:

AngularJS exemples

<Div ng-app = "myApp ng-contrôleur" = "personCtrl">

<P> nom est {{lastName | majuscules}} < / p>

</ Div>

Essayez »

filtre minuscules pour le formatage de chaînes en minuscules:

AngularJS exemples

<Div ng-app = "myApp ng-contrôleur" = "personCtrl">

<P> nom est {{lastName | minuscules}} < / p>

</ Div>

Essayez »

filtre de monnaie

filtre numérique de change sera formaté comme format monétaire:

AngularJS exemples

<Div ng-app = "myApp ng-contrôleur" = "costCtrl">

<Input type = "nombre" ng -modèle = "quantité">
<Input type = "nombre" ng -modèle = "price">

<P> prix total = {{(quantité * prix) | monnaie}} </ p>

</ Div>

Essayez »

Ajout de filtres à l'instruction

Filtrer à travers un caractère pipe (|), et un filtre est ajouté à la directive.

orderBy Agencement de réseau de filtres selon l'expression:

AngularJS exemples

<Div ng-app = "myApp ng-contrôleur" = "namesCtrl">

<Ul>
<Li ng-repeat = "x dans les noms | orderBy: 'country'">
{{X.name + ',' + x.country}}
</ Li>
</ Ul>

<Div>

Essayez »

entrée du filtre

Filtre d'entrée par un caractère pipe (|), et un filtre est ajouté à la directive, le filtre suivi par deux points et un nom de modèle.

les filtres de filtre sélectionner un sous - ensemble de la matrice:

AngularJS exemples

<Div ng-app = "myApp ng-contrôleur" = "namesCtrl">

<P> <input type = " text" ng-model = "test"> </ p>

<Ul>
<Li ng-repeat = "x dans les noms | Filtre: Test | orderBy: 'country'">
{{(X.name | majuscule) + ',' + x.country}}
</ Li>
</ Ul>

</ Div>

Essayez »