• angular学习笔记(十六) -- 过滤器(1)


    本篇主要介绍过滤器的基本用法:

    过滤器用来对数据进行格式的转换,数据格式的转化与逻辑无关,因此,我们使用过滤器来进行这些操作:

    {{expression | filter1:,参数1,2... | filter2: 参数1,参数2... }}

    expression : 表达式,也就是还没有经过过滤的变量值,相当于普通的 {{}}里面的内容

    filter1 : 过滤器的名字,可以是angular内置的过滤器,也可以自定义过滤器(在下一篇里讲解)

    参数1,参数2,... : 需要被传递给过滤器函数的参数,可以有多个

    过滤器可以通过 "|" 进行多次过滤

    下面来看一些angular内置的过滤器的基本用法:

    <!DOCTYPE html>
    <html ng-app>
    <head>
      <title>13.1过滤器</title>
      <meta charset="utf-8">
      <script src="../angular.js"></script>
      <script src="script.js"></script>
    </head>
    <body>
    <div ng-controller="filter">
      <span>{{num | number:2 }}</span>
      <br>
      <span>{{num | number:0 }}</span>
      <br>
      <span>{{num | number:0 | currency }}</span>
      <br>
      <span>{{num | currency }}</span>
      <br>
      <span>{{day | date }}</span>
      <br>
      <span>{{word | uppercase}}</span>
    </div>
    </body>
    </html>
    function filter($scope){
        $scope.word  = 'code_bunny';
        $scope.day  = 1302375948026;
        $scope.num  = 12.956;
    }

    1.{{num | currency }}

       currency: 把数字过滤成美元,四舍五入格式化成小数点后两位.

    2. {{num | number:0 }}

       number: 格式化数字,后面的参数表示格式化时保留小数点后面的个数,0就是不保留小数,1就是取一位,四舍五入

    3. {{num | number:0 | currency }}

       number | currency : 先格式化数字,再格式化成美元

    4. {{word | uppercase}}

       uppercase :  将单词的小写转为大写

    这里只是举例,还有很多内置的angular过滤器.详细可以看手册

    --------------------------------------------------------------------------------------------------------

    遗留问题:

    1.currency过滤器如果不要格式化到小数点后面2位的话,不知道怎么处理,现在即使给一个没有小数的整数,比如12,它也会格式化为$12.00




  • 相关阅读:
    Kafka笔记—可靠性、幂等性和事务
    简易 bokeh 图像散景效果算法实现
    unisound_asr 云知声 语音识别 python版接口
    分享用于学习C++音频处理的代码示例
    集 降噪 美颜 虚化 增强 为一体的极速图像润色算法 附Demo程序
    快速双边滤波 附完整C代码
    pixel art之 hqx 算法
    这一路走来,冷暖自知 (附算法demos)
    票据OCR前预处理 (附Demo)
    学习图像算法阶段性总结 (附一键修图Demo) 2016.04.19更新demo
  • 原文地址:https://www.cnblogs.com/liulangmao/p/3741366.html
Copyright © 2020-2023  润新知