zoukankan      html  css  js  c++  java
  • AngularJS的Filter用法详解

     1 <div>
     2  条件: <input type="text" ng-model="yyy">
     3     <ul>
     4         <li ng-repeat="phone in phones| filter:yyy">{{phone.name}}</li>
     5     </ul>
     6 </div>
     7 
     8 </body>
     9 <script src="../lib/angular/angular.js"></script>
    10 <script>
    11     angular.module('zfpxMod',[]);
    12     angular.module('zfpxMod').controller('zfpxCtrl',function($scope){
    13         $scope.phones = [
    14             {name:'三儿子',age:'1'},
    15             {name:'huawei',age:'2'},
    16             {name:'xiaomi',age:'3'}
    17         ]
    18     });
    19 </script>

    Filter简介:过滤变量的值,或者格式化输出,得到自己所期望的结果或格式

    Filter是用来格式化数据用的。

    Filter的基本原型( '|' 类似于Linux中的管道模式):

    {{ expression | filter }}

    Filter可以被链式使用(即连续使用多个filter):

    {{ expression | filter1 | filter2 | ... }}

    Filter也可以指定多个参数:

    {{ expression | filter:argument1:argument2:... }}

    方法原型:

    function(amount, currencySymbol, fractionSize)

    用法:

    1 {{ 12 | currency}}  <!--将12格式化为货币,默认单位符号为 '$', 小数默认2位-->
    2 
    3 {{ 12.45 | currency:'¥'}} <!--将12.45格式化为货币,使用自定义单位符号为 '¥', 小数默认2位-->
    4 
    5 {{ 12.45 | currency:'CHY¥':1}} <!--将12.45格式化为货币,使用自定义单位符号为 'CHY¥', 小数指定1位, 会执行四舍五入操作 -->
    6 
    7 {{ 12.55 | currency:undefined:0}} <!--将12.55格式化为货币, 不改变单位符号, 小数部分将四舍五入 -->
  • 相关阅读:
    大话重构读书笔记——保险索下的系统重构
    大话重构读书笔记——小步快跑的开发模式
    大话重构读书笔记——基础篇一
    [C#高级编程]基础知识摘要一
    测试基础
    WatiN和HttpWatch交互简介
    WatiN框架学习二——对弹窗的处理
    WatiN框架学习
    [C#高级编程].NET体系结构
    http协议的API
  • 原文地址:https://www.cnblogs.com/xu-blog/p/6753291.html
Copyright © 2011-2022 走看看