<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <style type="text/css">
        .ms-controller {
            visibility: hidden;
        }
    </style>
    <script src="Content/js/avalon.js"></script>
</head>
<body>
    <div ms-controller="filter">

<%--输出html格式--%>
        <span>{{aaa|html}}</span><br />
        <br />

<%--字母大写化--%>
        <span>{{bbb|uppercase}}</span><br />
        <br />

<%--字母小写化--%>
        <span>{{ccc|lowercase}}</span><br />
        <br />

<%--从头开始截取5个字符，位数使用后面的字符串填充--%>
        <span>{{ddd|truncate(5,'00')}}</span><br />
        <br />

<%--驼峰处理--%>
        <span>{{eee|camelize}}</span><br />
        <br />

<%--货币处理--%>
        <span>{{fff|currency('$')}}</span><br />
        <br />

<%--2:表示两位小数
       .:表示小数点的形式
       ,:表示千分位的分隔符--%>
        <span>{{ggg|number(2)}}</span><br />
        <br />
        <span>{{ggg|number(2,".")}}</span><br />
        <br />
        <span>{{ggg|number(2,".",",")}}</span><br />
        <br />

<%--时间过滤器--%>
        <span>{{new Date|date("yyyy MM dd HH:mm:ss  a")}}</span><br />
        <br />
        <span>{{"2011-07-08"|date("EEE MM dd yyyy")}}</span><br />
        <br />

<%--时间戳转换--%>
        <span>{{"1373021259229"|date("yyyy年MM月dd日")}}</span><br />
        <br />
        <span>{{"1373021259229"|date("yyyy-MM-dd HH:mm:ss a")}}</span><br />
        <br />
        <span>{{"1373021259229"|date("yyyy-MM-dd mm:ss")}}</span><br />
        <br />

<span>USD:{{"USD"|parseSymbol}}</span><br />
    </div>
</body>
<script type="text/javascript">
    avalon.filters.parseSymbol = function (str) {
        return {
            '元': '元',
            'USD': '美元',
            'HKD': '港元'
        }[str];
    }

var vm = avalon.define({
        $id: "filter",
        aaa: "<span>hello avalon!</span>",
        bbb: "字母大写化：hello avalon!",
        ccc: "字母小写化：HELLO AVALON!",
        ddd: "字符串截断处理",
        eee: "驼峰处理：abc-def-hig",
        fff: "2255",
        ggg: "546345.541343",

});
</script>

</html>

avalon过滤的更多相关文章

  1. avalon学习笔记一 列表及条件过滤

    好长时间都没有更新博客了,不是因为没有学习新的东西,而是到了新的单位每天玩命加班实在是太累了!经过一年的努力吧,终于可以轻松一下了.废话少说,直接干货吧! 由于是学习阶段,就直接拿了公司的二级页面做了 ...

  2. MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录

    注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...

  3. 轻量级前端MVVM框架avalon - 模型转换

    接上一章 ViewModel modelFactory工厂是如何加工用户定义的VM? 附源码 洋洋洒洒100多行内部是魔幻般的实现 1: function modelFactory(scope) { ...

  4. 轻量级前端MVVM框架avalon - 控制器

    引子: 最近工作挺忙,avalon只能断断续续的写下去了,大概看了下angular的源码,看到小一半就比较难坚持了,是块硬骨头,慢慢啃吧 不过angular的的文档中用词还是很优雅: HTML编译器 ...

  5. 前端MVVM框架avalon揭秘 - HTML编译器

    MVVM试图更加清晰的讲用户界面(UI)开发从应用程序的业务逻辑与行为中心分离,因为,很多这样的模式的实现都需要利用声明式数据绑定来实现讲View(视图)工作从其他层分离 所以出现了一大堆自定义的声明 ...

  6. 使用mvvm框架avalon开发公司内部运营管理系统的一些心得

    接触avalon差不多有一年时间了,当时是看前端大牛司徒正美的博客才了解到还有这么一个高大上的玩意,然后就加入了avalon的讨论群.从群里零零散散的了解了avalon的一些特性,感觉很强大,感觉思想 ...

  7. 运行avalon.define()发生的事情

      avalon.define = function(id, factory) { var $id = id.$id || id if (!$id) { log("warning: vm必须 ...

  8. 前端MVVM框架avalon - 模型转换1

    轻量级前端MVVM框架avalon - 模型转换(一) 接上一章 ViewModel modelFactory工厂是如何加工用户定义的VM? 附源码 洋洋洒洒100多行内部是魔幻般的实现 1: fun ...

  9. avalon的使用与总结

    avalon是前端MVVM框架,将所有前端代码彻底分成两部分,视图的处理通过绑定实现(angular有个更炫酷的名词叫指令),业务逻辑则集中在一个个叫VM的对象中处理.我们只要操作VM的数据,它就自然 ...

随机推荐

  1. QlikSense系列(1)——整体介绍

    接触QlikSense(3.1 SR1)已经快一年了,在此记录自己的经验心得,为想了解QlikSense的小伙伴提供一个参考. 1.产品介绍 Qlik公司以QlikView产品成名,QlikSense ...

  2. Java Servlet 配置

    图片太大,可以右键另存再查看,也可以鼠标点击拖置一下,用浏览器单独承载放大查看.

  3. javaweb 之 文件上传与下载

    1.文件上传的原理分析 1.1文件上传的必要前提: a.提供form表单,method必须是post b.form表单的enctype必须是multipart/form-data c.提供input ...

  4. pgpool中的配置参数的定义

    /* * configuration parameters */typedef struct {    char *listen_addresses;            /* hostnames/ ...

  5. 03《UML大战需求分析》之三

    学习了活动图之后,我又学习了流程分析工具之二的状态机图.看上去状态机图和活动图很类似,我也很容易从活动图的角度来理解状态机图.但是学习之后,发现两种图是两种完全不同的分析角度.活动图在流程分析时是玩你 ...

  6. 【fiddler】 fiddler总是在菜单栏下面弹出提示“The system proxy was changed，click to reenable fiddler capture”--转

    源地址:http://blog.csdn.net/htdeyanlei/article/details/52873060 标签: fiddler 2016-10-20 15:28 2747人阅读 评论 ...

  7. zookeeper+kafka集群搭建

    一.ZK集群安装. 解压安装包后进入conf目录,conf/zoo_sample.cfg拷贝一份命名为zoo.cfg,同时也放在conf下面. zookeeper配置文件: # The number ...

  8. Oracle-Trigger-Insert tableA and tableB

    create or replace trigger trg_a after insert ON a for each rowbegin   INSERT INTO b values(:NEW.ID,: ...

  9. debian 9 添加源

    1.将下面内容的添加入/etc/apt/sources.list(香港镜像) #For software deb http://mirrors.ustc.edu.cn/debian/ stretch ...

  10. webpack不打包指定的js文件

    背景: 在项目实际开发中,有一些IP地址需要随时修改,进行部署,例如websocket的地址.因此在项目打包的时候,不希望保持IP地址的文件被打包,因此就需要把需要修改的常量独立出来,存放在一个js文 ...