AngularJS 过滤器
2016-12-26 13:44
260 查看
过滤器可以使用管道符(|)添加到表达式和指令中。
过滤器 | 描述
currency | 格式化数字为货币格式。
filter | 从数组项中选择一个子集。
lowercase | 格式化字符串为小写。
orderBy | 根据某个表达式排列数组。
uppercase | 格式化字符串为大写。
2.lowercase过滤器将字符串格式化为小写
3.currency 过滤器将数字格式化为货币格式:
orderBy过滤器根据表达式排列数组,filter过滤器后跟一个冒号和一个模型名称,从数组中选择一个子集。
1.AngularJS过滤器
AngularJS过滤器可以用于转换数据:过滤器 | 描述
currency | 格式化数字为货币格式。
filter | 从数组项中选择一个子集。
lowercase | 格式化字符串为小写。
orderBy | 根据某个表达式排列数组。
uppercase | 格式化字符串为大写。
2。表达式中添加过滤器
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>
3.currency 过滤器将数字格式化为货币格式:
<div ng-app="myApp" ng-controller="costCtrl"> <input type="number" ng-model="quantity"> <input type="number" ng-model="price"> <p>总价 = {{ (quantity * price) | currency }}</p> </div>
3.向指令添加过滤器
过滤器可以通过一个管道字符和一个过滤器添加到指令中。orderBy过滤器根据表达式排列数组,filter过滤器后跟一个冒号和一个模型名称,从数组中选择一个子集。
<div ng-app="myApp" ng-controller="namesCtrl"> <p><input type="text" ng-model="test"></p> <ul> <li ng-repeat="x in names | filter:test | orderBy:'country'"> {{ (x.name | uppercase) + ', ' + x.country }} </li> </ul> </div>
相关文章推荐
- angularjs过滤器filter处理时间格式
- angularjs 自定义过滤器filter和用法
- angularjs学习 过滤器(filter)
- angularJS 过滤器
- AngularJS入门教程之过滤器用法示例
- AngularJS 过滤器
- 【AngularJS学习笔记】01 指令、服务和过滤器
- angularjs 自带的过滤器
- AngularJS过滤器filter-时间日期格式-渲染日期格式-$filter
- AngularJs Filter详解2--自定义过滤器
- AngularJs学习第八篇 过滤器filter创建
- AngularJS的过滤器总结
- angularJS添加表格,通过过滤器查找
- angularjs给Model添加拦截过滤器,路由增加限制,实现用户登录状态判断
- AngularJs中组件、过滤器、自定义过滤器的使用
- AngularJS 自定义过滤器详解及实例代码
- AngularJS(3)-过滤器
- AngularJS使用Filter自定义过滤器控制ng-repeat去除重复功能示例
- AngularJS初学之:过滤器
- AngularJs的过滤器