angularjs过滤器

来源:互联网 发布:派克中性笔 知乎 编辑:程序博客网 时间:2024/06/16 10:50
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title>    <script src="../angular-1.5.5/angular.min.js"></script>    <script>        var myapp = angular.module("myapp",[]);        myapp.controller("myCtrl",["$scope",function ($scope) {            $scope.nowd=new Date();//获取当前日期            console.log("当前日期",$scope.nowd);        }]);    </script></head><body ng-app="myapp" ng-controller="myCtrl">常用过滤器:<ul>    <!--<li>-->        <!--请输入你需要的金额:<input ng-model="mymoney">-->        <!--<p>|currency:"$"{{mymoney|currency:'¥'}}</p>-->    <!--</li>-->    <li>        请输入你需要的金额:<input ng-model="mymoney">        <p>|currency:{{mymoney|currency:'$'}}</p>    </li>    <li>        请输入你的英文名:<input ng-model="fisrtname">        <p>使用过滤器指定为大写{{fisrtname|uppercase}}</p>    </li>    <li>        请输入你的英文名:<input ng-model="fisrname">        <p>使用过滤器指定为小写{{fisrname|lowercase}}</p>    </li>    <li>        当前日期为:        <p>{{nowd|date: "yyyy年MM月dd日 hh:mm:ss"}}</p>    </li>    <li>        limitto:        <p ng-init="datas=['aa','bb','cc','apple','oranange']">            {{datas|limitTo:-2}}        </p>    </li>    <li>        filter:        <p ng-init="datas=['aa','bb','cc','apple','oranange']">            {{datas|filter:'a'}}        </p>    </li>    <li>        order by:        <p ng-init="datas=['aa','bb','cc','apple','oranange','dept']">            true降序 {{datas|orderBy: '':true}}            false升序{{datas|orderBy: '':false}}        </p>        给对象排序        <p ng-init="stus=[{name:'gaoyn',age:19},{name:'周一',age:29},{name:'王大拿',age:20}]">            true降序 {{stus|orderBy: 'age':true}} <br/>            false升序{{stus|orderBy: 'age':false}}        </p>        指定函数 根据age排  name排序        <p ng-init="stus=[{name:'gaoyn',age:19},{name:'zh',age:29},{name:'王大拿',age:20},{name:'zy',age:19}]">            true降序 {{stus|orderBy: ['age','name']:false }} <br/>        </p>    </li></ul></body></html>