Analyse d'un exemple d'utilisation du filtre AngularJS

L'exemple de cet article décrit l'utilisation du filtre AngularJS. Partagez-le avec tout le monde pour votre référence, les détails sont les suivants :

Dans cette section, nous examinerons le filtre d'angularjs.

Dans notre développement, les informations qui doivent être affichées à l'utilisateur sur la page doivent être formatées avant de pouvoir être affichées à l'utilisateur. Par exemple, localisation de l'heure, ou format aaaa-MM-jj HH:mm:ss, formatage de précision numérique, localisation, formatage du nom, etc. Angularjs nous fournit une commande appelée filtre, qui nous permet d'exécuter facilement une série de fonctions. Angularjs nous fournit de nombreux filtres intégrés tels que le nombre. Et nous pouvons facilement personnaliser nos propres filtres de champ.

L'exemple suivant :

html:

<div ng-app="app" ng-controller="test">
num:<input ng-model="num" />
<br/>
{{num | number}}
<br/>
{{num | number:2}}
<br/>
first name:<input ng-model="person.first"/>
<br/>
last name:<input ng-model="person.last"/>
<br/>
name: {{person | fullname}}
  <br/>
name: {{person | fullname:"- -"}}
    <br/>
name: {{person | fullname:" " | uppercase }}
</div>

js:

function test($scope) {
}
angular.module("app", []).controller("test", test).
filter("fullname", function() {
  var filterfun = function(person, sep) {
    sep = sep || " ";
    person = person || {};
    person.first = person.first || "";
    person.last = person.last || "";
    return person.first + sep + person.last;
  };
  return filterfun;
});

effet jsfiddle : http://jsfiddle.net/whitewolf /uCPPK/9/

démontre d'abord l'utilisation du filtre numérique fourni avec angulairejs dans l'exemple. Nous vous montrons également comment créer un filtre angulairejs. L'implémentation est très simple. Avec Angularjs, il est naturel de tout étendre

Remarque finale : les filtres Angularjs prennent en charge l'écriture en chaîne, comme le modèle de pipeline de PowerShell ou d'autres langages shell du système d'exploitation, sous la forme de value | .

J'espère que cet article sera utile à tous ceux qui programment AngularJS.

Pour plus d'analyses d'exemples d'utilisation de filtre AngularJS et d'articles connexes, veuillez prêter attention au site Web PHP chinois !