AngularJS filter usage Example Analysis

This article mainly introduces the use of AngularJS filter, and analyzes the definition and usage of the filter based on examples. For more information, see the examples in this article. We will share this with you for your reference. The details are as follows:

In this section, let's take a look at angularjs's filter.

In our development, the information displayed on the page must be formatted to be displayed to the user. For example, time localization, or yyyy-MM-dd HH: mm: ss format, numeric precision formatting, localization, name formatting, and so on. In angularjs, the filter command is provided for us, allowing us to easily implement some column functions. angularjs provides many built-in filters such as number. In addition, we can easily customize our own domain filters.

Example:

Html:

num:
{{num | number}}
{{num | number:2}}
first name:
last name:
name: {{person | fullname}}  
name: {{person | fullname:"- -"}}    
name: {{person | fullname:" " | uppercase }}

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;});

Jsfiddle effect: http://jsfiddle.net/whitewolf/uCPPK/9/

In the example, we first demonstrated the use of angularjs's built-in number filter. Then we created a filter for angularjs. Its implementation is very simple. angularjs makes it natural to expand everything

Final Description: angularjs filters supports chained writing, and uses the same pipeline model as powershell or other operating system shell languages, such as value | filter1 | filter2.

I hope this article will help you with AngularJS programming.

For more articles on AngularJS filter usage and instance analysis, please refer to PHP Chinese network!