angular第四天

1、过滤器种类

　　1.1 limitTo

　　1.2 urrency

　　1.3 number

　　1.4 json

　　1.5 lowercase

　　1.6 uppercase

　　1.7 date

　　1.8 orderby

<!-- index.html -->
<!DOCTYPE html>
<html ng-app="myApp">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="angular.js"></script>
</head>
<body>
    <div>
        <!-- 正排序:从小到大 -->
        <pre>
            {{ tring | orderBy: "age"  | json}}
        </pre>

        <pre>
            {{ tring | orderBy: "name"  | json}}
        </pre>

        <pre>
            {{ tring | orderBy: "sex"  | json}}
        </pre>

        <!-- 逆排序:从到小 -->
        <pre>
            {{ tring | orderBy: "age" : true |  json}}
        </pre>
    </div>

</body>
<script type="text/javascript">

    var app = angular.module("myApp", []);

    app.run(["$rootScope",function($rootScope){
        $rootScope.tring = [
            { 
                "name": "gaoxiong",
                "age": 23,
                "sex": "female"
            },{
                "name": "xiaohua",
                "age": 22,
                "sex": "ddzx"
            },{
                "name": "liuyingchun",
                "age": 21,
                "sex": "female"
            }
        ]
    }]);

    console.log(app);
</script>
</html>

　　1.9 filter

<!-- index.html -->
<!DOCTYPE html>
<html ng-app="myApp">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="angular.js"></script>
</head>
<body>
    <p>匹配包含</p>
    <div>
        {{ tring | filter: "x" }}
    </div>
    <p>匹配整体</p>
    <div>
        {{ tring | filter: "x" : true }}
    </div>
</body>
<script type="text/javascript">
    var app = angular.module("myApp", []);
    app.run(["$rootScope",function($rootScope){
        $rootScope.tring = [
            { 
                "name": "gaoxiong",
                "age": 23,
                "sex": "female"
            },{
                "name": "xiaohua",
                "age": 22,
                "sex": "ddzx"
            },{
                "name": "liuyingchun",
                "age": 21,
                "sex": "female"
            },{
                "name": "x",
                "age": 20,
                "sex": "female"
            }
        ]
    }]);
    console.log(app);
</script>
</html>

posted on 2016-10-15 09:45 花雨伞阅读(110) 评论(0) 收藏举报