AngularJS之$filter

半兽人 发表于: 2018-10-02   最后更新时间: 2018-10-02 20:54:56  
{{totalSubscript}} 订阅, 3,347 游览

特性

  • $filter是用来进行数据格式化的专用服务
  • AngularJS内置了9个filter:currency,data,filter,json,limitTo,lowercase,number,orderBy,uppercase
  • filter可以嵌套使用(用管道符号|分隔)
  • filter是可以传递参数的
  • 用户可以定义自己的filter

例子1 - 日期格式化

<html ng-app="MyModule">
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <script src="framework/angular-1.3.0.14/angular.js"></script>
        <script src="Filter.js"></script>
    </head>
    <body>
        {{ 1304375948024 | date }}
        <br>
        {{ 1304375948024 | date:"MM/dd/yyyy @ h:mma" }}
        <br>
        {{ 1304375948024 | date:"yyyy-MM-dd hh:mm:ss" }}
        <br>
    </body>
</html>

<script>
var myModule=angular.module("MyModule",[]);
</script>

例子2 - 自定义filter

<html ng-app="MyModule">

<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <script src="framework/angular-1.3.0.14/angular.js"></script>
    <script src="MyFilter.js"></script>
</head>

<body>
    {{'orchome'|filter1 }}
</body>

</html>

js

var myModule=angular.module("MyModule",[]);
myModule.filter('filter1',function(){
    return function(item){
        return item + 'o(∩_∩)o';
    }
});

结果:

orchomeo(∩_∩)o
更新于 2018-10-02

查看AngularJS更多相关的文章或提一个关于AngularJS的问题,也可以与我们一起分享文章