简述angularjsh中constant和$filter的用法

大家好，我是IT修真院郑州分院第八期的学员，今天给大家分享一下，题目angular js中constant和$filter的用法。

一、背景介绍

AngularJS中有时在不同的控制器中使用到同一个变量，需要在ng-app或控制器中定义的全局变量。angularjs自身有二种设置全局变量的方法，constant()是其中的一种方法。

Filter作用就是接收一个输入，通过某个规则进行处理，然后给用户返回处理后的结果。Filter可以用在模板、控制器、或者服务，同时也会很容易自定义一个Filter过滤器。

二、知识剖析

定义全局变量的三种方法

1）通过var 直接定义global variable。

2）用angularjsconstant来设置全局变量。

3）用angularjsvalue来设置全局变量 。

 

constant和value的区别

1）value不可以在config里注入，但是constant可以；

2）value可以修改，但是constant不可以修改，一般直接用constant配置一些需要经常使用的数据。

$filter过滤器

filter是用来格式化数据用的

基本原型

{{expression | filter}}

多个filter连用版

{{expression | filter1 | filter2}}

传入参数版

{{expression | filter:1:2}}

 ```

$filter内置过滤器

ng内置了9种过滤器，分别是：currency(货币)、date(日期)、filter(子串匹配)、json(格式化json对象)、limitTo(限制个数)、lowercase(小写)、uppercase(大写)、number(数字)、orderBy(排序)。

 

    

三、常见问题

如何使用constant和$ilter

四、解决方案

五、编码实战 

腾讯视频

六、拓展思考

如何自定义过滤器


$filter自定义过滤器：

{{带过滤数据 | 过滤器名：参数1：参数2：参数3.....}}

app.filter('过滤器名', function () {

        returnfunction (待过滤数据, 参数....) {

                     ......

           return  已过滤数据;

 }

}）； 

七、参考文献

参考一：angularjs自定义过滤器示例

参考二：angularjs三种定义全局变量的方法

参考三：angularjs内置9种过滤器

八、更多讨论

讨论一：如何获取angular通过过滤器过滤后的数据

在module里面去取

angular.module('tset', ['$filter', function($filter){

    var a = 10;

    var b = $filter('currency')(a, '￥');

}])

 

讨论二：constant和value用法上的区别

Constant可以注入config，value不可以。除此之外，constant和value定义全局变量时的用法是相同的，constant的值也是可以改变的，但是我们认为规定定义constant全局变量之后当做一个常量来使用，在之后的操作中不更改constant的值，认为设置了constant值可以改变，value值可以改变的设定。在之后的学习工作中也尽量遵守这一规则。

讨论三：为什么angular的过滤器要采用闭包的形式？目的是什么

app.filter 这种函数回掉的机制是由于异步
而采用闭包就是为了不污染全局变量的情况下，保存数据（从js角度出发，angular有可能是为了实现数据双向绑定（需要保存数据），又不制造过多的全局变量）。
但是在angular中有其他什么特殊意义或目的，没有深入了解