Angular的很多服务，在DOM中有对应的对象，那为什么不使用这些对象，而是要用服务呢？
因为这些服务可以获取到Angular应用声明周期的每一个阶段，并且和$watch整合，让Angular可以监控应用，处理事件变化。普通的DOM对象则不能在Angular应用声明周期中和应用整合。
date过滤器的功能是基于要求的格式格式化一个日期成为一个字符串。
格式化字符串的基本参数：
上面这些参数我们可以根据自己的意愿自由组合得到自己想要的格式，例如 yyyy-MM-dd 等。
格式化字符串也提供了一些预定义的本地化格式，可以方便我们使用：
格式化字符串可以包含文本值。这些需要被单引号包围（例如 "h 'in the morning'"）,如果想输出一对单引号，就在一个序列中用两个双引号（例如："h 'o''clock'"）
date过滤器的用法：
1.在html中用法：{{ date_expression | date : format : timezone}}
实例：
<span>{{1288323623006 | date:'medium'}}</span><br> <span>{{1288323623006 | date:'yyyy-MM-dd HH:mm:ss Z'}}</span><br> <span>{{'1288323623006' | date:'MM/dd/yyyy @ h:mma'}}</span><br> <span>{{'1288323623006' | date:"MM/dd/yyyy 'at' h:mma"}}</span><br>
Oct 29, 2010 11:40:23 AM2010-10-29 11:40:23 +080010/29/2010 @ 11:40AM10/29/2010 at 11:40AM
2.在javascript中的用法：$filter('date')(date, format, timezone)
<div ng-app="myApp" ng-controller="myCtrl"> {{ formatDate }}</div>
var today = new Date(); $scope.formatDate = $filter('date')(today, 'yyyy-MM-dd');
2019-03-25
具体的操作就是在调用的时候用"：参数" 的格式在后面追加即可
var app = angular.module('myApp', []); app.controller('myCtrl', function($scope) { }); app.filter('myfilter', function() { //可以注入依赖 return function(text) { var newArguments= Array.prototype.slice.call(arguments); return text+newArguments.join(','); } });
尝试一下 »
过滤器实例:
<div ng-controller="myCtrl"> <div ng-bind="myName | uppercase"></div> <!--uppercase转换成大写--> <div ng-bind="myName | lowercase"></div> <!--lowercase转换成小写--> <div class="" ng-bind="money | currency : '￥'"> </div><!--currency 过滤器将数字格式化为货币格式--> <div class="" ng-repeat="v in city | orderBy:'id'"> <p ng-bind="v.name"></p> </div><!--orderBy 过滤器根据表达式排列数组--> <div class="" ng-repeat="v in city | orderBy:'-id' | filter : ''"> <p ng-bind="v.name" style="color:red;"></p> </div><!--orderBy 过滤器根据表达式排列数组 默认正序asc,倒序添加-负号--> <!--filter 过滤器根据表达式过滤不包含过滤器中的内容--> <!--自定义注入依赖--> <div class="" ng-bind="myName | aa" style="color:blue;"> <!--自定义过滤器aa--> </div> </div>
1、uppercase，lowercase 大小写转换
{{ "lower cap string" | uppercase }} // 结果：LOWER CAP STRING {{ "TANK is GOOD" | lowercase }} // 结果：tank is good
2、date 格式化
{{1490161945000 | date:"yyyy-MM-dd HH:mm:ss"}} // 2017-03-22 13:52:25
3、number 格式化（保留小数）
{{149016.1945000 | number:2}}
4、currency货币格式化
{{ 250 | currency }} // 结果：$250.00 {{ 250 | currency:"RMB ￥ " }} // 结果：RMB ￥ 250.00
5、filter查找
输入过滤器可以通过一个管道字符（|）和一个过滤器添加到指令中，该过滤器后跟一个冒号和一个模型名称。
filter 过滤器从数组中选择一个子集
// 查找name为iphone的行 {{ [{"age": 20,"id": 10,"name": "iphone"}, {"age": 12,"id": 11,"name": "sunm xing"}, {"age": 44,"id": 12,"name": "test abc"} ] | filter:{'name':'iphone'} }}
6、limitTo 截取
{{"1234567890" | limitTo :6}} // 从前面开始截取6位 {{"1234567890" | limitTo:-4}} // 从后面开始截取4位
7、orderBy 排序
// 根id降序排 {{ [{"age": 20,"id": 10,"name": "iphone"}, {"age": 12,"id": 11,"name": "sunm xing"}, {"age": 44,"id": 12,"name": "test abc"} ] | orderBy:'id':true }} // 根据id升序排 {{ [{"age": 20,"id": 10,"name": "iphone"}, {"age": 12,"id": 11,"name": "sunm xing"}, {"age": 44,"id": 12,"name": "test abc"} ] | orderBy:'id' }}
感谢您的支持，我会继续努力的!
支付宝扫一扫，即可进行扫码打赏哦
725AngularJS Service
Angular的很多服务，在DOM中有对应的对象，那为什么不使用这些对象，而是要用服务呢？
因为这些服务可以获取到Angular应用声明周期的每一个阶段，并且和$watch整合，让Angular可以监控应用，处理事件变化。普通的DOM对象则不能在Angular应用声明周期中和应用整合。
724AngularJS 过滤器
date过滤器的功能是基于要求的格式格式化一个日期成为一个字符串。
格式化字符串的基本参数：
上面这些参数我们可以根据自己的意愿自由组合得到自己想要的格式，例如 yyyy-MM-dd 等。
格式化字符串也提供了一些预定义的本地化格式，可以方便我们使用：
格式化字符串可以包含文本值。这些需要被单引号包围（例如 "h 'in the morning'"）,如果想输出一对单引号，就在一个序列中用两个双引号（例如："h 'o''clock'"）
date过滤器的用法：
1.在html中用法：{{ date_expression | date : format : timezone}}
实例：
Oct 29, 2010 11:40:23 AM
2010-10-29 11:40:23 +0800
10/29/2010 @ 11:40AM
10/29/2010 at 11:40AM
2.在javascript中的用法：$filter('date')(date, format, timezone)
实例：
<div ng-app="myApp" ng-controller="myCtrl"> {{ formatDate }}</div>
2019-03-25
723AngularJS 过滤器
自定义过滤器 -- 多参数
具体的操作就是在调用的时候用"：参数" 的格式在后面追加即可
尝试一下 »
722AngularJS 过滤器
过滤器实例:
尝试一下 »
721AngularJS 过滤器
1、uppercase，lowercase 大小写转换
2、date 格式化
3、number 格式化（保留小数）
4、currency货币格式化
5、filter查找
输入过滤器可以通过一个管道字符（|）和一个过滤器添加到指令中，该过滤器后跟一个冒号和一个模型名称。
filter 过滤器从数组中选择一个子集
6、limitTo 截取
7、orderBy 排序