• 过滤器


    过滤器
    过滤器是用在表达式中,实现对表达式结果的筛选、过滤、格式化,达到更好的表现效果


    语法:|--》管道
    {{表达式 | 过滤器1:'name' | 过滤器2 }}

    货币及任意符号

    <p>{{price}}</p>
    <p>{{price | currency}}</p>
    <p>{{price | currency :'¥'}}</p>
    <p>{{price | currency :'&'}}</p>

    时间
    <p>{{2336547896454 | date :'yyyy/MM/dd'}}</p>      2044/01/16
    <p>{{'lary' | uppercase}}</p>           大写
    <p>{{'lary' | lowercase}}</p> 小写

    orderBy 升序或者降序 orderBy:'age':true

    <ul ng-repeat="obj in list | orderBy:'age':true">
    <li>{{obj.name}}</li>
    </ul>

    js:
    $scope.list = [
    {name:'Lucy',age:30,score:95},
    {name:'Apple',age:10,score:90},
    {name:'Pen',age:32,score:100},
    {name:'Pen',age:40,score:100}
    ];

    limitTo 限定显示的数量
    <ol ng-repeat="obj in list | orderBy:'age':false | limitTo:3">
    <li>{{obj.name}}</li>
    </ol>

    只显示前3个


    number 限制显示小数点后几位

    <p>{{price | number : 3}}</p>
    只显示小数点后面3位

    练习:
        <ul ng-repeat="obj in list | orderBy:'score':true | limitTo:3">  按照分数排序,取前三个
    <li>{{obj.name+" "+obj.age+" "+obj.score}}</li>
    </ul>
    </div>
    <script>
    var app = angular.module('myApp', ['ng']);
    app.controller('myCtrl', function ($scope) {
    $scope.list = [
    {name:'Michael',age:30,score:80},
    {name:'Lincoln',age:20,score:90},
    {name:'TBag',age:80,score:95},
    {name:'TBag1',age:80,score:92},
    {name:'TBag2',age:80,score:10}
    ];
    })

    
    
    toJson/fromJson 

    序列化:将一个json对象转换为json格式的字符串
    反序列化:将一个json格式的字符串 转换为json格式的对象

    //    定义一个json对象
    var jsonObj = {"name":"Lucy","age":20};
    // 通过toJson方法将一个json对象 序列化为一个json格式的字符串
    console.log(angular.toJson(jsonObj));
    // 通过fromJson方法,将一个json格式的字符串 反序列化为一个json格式的对象
    console.log(angular.fromJson(jsonObj))

    
    
     
  • 相关阅读:
    THUSC2016 成绩单 和 LOJ3226 Greedy Pie Eaters
    LOJ3215 Muzyka pop
    LOJ3223 Trzy kule
    ZJOI2015 幻想乡战略游戏 和 SCOI2019 找重心
    LOJ3235 Przedszkole 和 有限空间跳跃理论
    SCOI2019 湖之精灵的游戏
    SCOI2016 幸运数字
    SCOI2014 方伯伯的商场之旅
    POJ3621 Sightseeing Cows 和 CH6B12 最优高铁环 和 SCOI2014 方伯伯运椰子
    SCOI2014 方伯伯的OJ 和 NOIP2017 列队
  • 原文地址:https://www.cnblogs.com/liangfc/p/7543177.html
Copyright © 2020-2023  润新知