Angular JS 学习之过滤器

1.过滤器可以使用一个管道字符(|)添加到表达式和指令中；

2.AngularJS过滤器可用于转换数据：

**currency：格式化数字为货币格式；

**filter：从数组项中选择一个子集；

**lowercase：格式化字符串为小写；

**orderBy：根据某个表达式排序数组；

**uppercase：格式化字符串为大写；

 

3.表达式中添加过滤器：过滤器可以通过一个管道字符(|)和一个过滤器添加到表达式中；

（1）uppercase过滤器将字符串格式化为大写：

<div ng-app="myApp" ng-controller="personCtrl">

<p>姓名：{{lastName | uppercase}}</p>

</div>

 

（2）lowercase过滤器将字符串格式化为小写：

<div ng-app="myApp" ng-controller="personCtrl">

<p>姓名为：{{lastName | lowercase}}</p>

</div>

 

4.向指令添加过滤器：

（1）orderBy:根据表达式排列数组：

<div ng-app="myApp" ng-controller="namesCtrl">

<ul>

　　<li ng-repeat="x in name | orderBy:'country'">

　　　　{{x.name+','+x.country}}

　　</li>

</ul>

</div>

 

5.过滤输入：输入过滤器可以通过一个管道字符（|）和一个过滤器添加到指令中，该过滤器后跟一个冒号和一个模型名称；

<div ng-app="myApp" ng-controller="namesCtrl">

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

<ul>

　　<li ng-repeat="x in name | filter:test | orderBy:'country'">

　　　　{{(x.name | uppercase) +',' +x.country}}

　　</li>

</ul>

</div>