Angular自定义过滤器

来源：互联网发布：网络咨询护士工资多少编辑：程序博客网时间：2024/06/05 05:19

Angular自定义过滤器

由于AngularJS中只定义了九中内置过滤器，所以有的指令做不到某些需求，这时候我们需要自己定义过滤器来满足自己定义的功能。

其语法格式如下：

<!DOCTYPE html><html ng-app="myApp"><head>    <meta charset="UTF-8">    <title>Title</title>    <script src="js/lib/AngularJS/angular.min.js"></script></head><body><div ng-controller="myCtrl">    <div ng-bind="name"></div>    <div ng-bind="name | myfilter"></div></div><script>    var app = angular.module("myApp", []);    /*app.filter(name, fn):用于定义一个自定义过滤器     * name:过滤器名称     * fn:过滤器处理函数     * */    app.filter("myfilter", function() {        /*         * 过滤器中，直接return function(value) {}         * 通过闭包函数来实现数据处理，固定语法结构！         * value参数：第一个参数，用于接收要处理的数据：数据就是过滤器管道符前面变量中的数据         */        return function(value) {/*闭包函数中的value就是过滤器接收到的数据|就是准备过滤的数据*/            /*             * 这一部分主要是用来进行数据处理的             */            value = value.toUpperCase();            /* 过滤器中数据处理完成，一定要返回输出*/            return value;        }    });    app.controller("myCtrl", function($scope) {        $scope.name = "jerry";    });</script></body></html>

运行结果如下：

jerry

JERRY

0 0