本章节，主要是介绍avalon.config方法，通过它来制定一些更贴心的功能。

一般情况下，我们在使用ms-controller绑定时，需要添加一个ms-controller类名，目的是为了防止网速慢时将花括号暴露出来。

<!DOCTYPE html>

<html>

    <head>

        <title>avalon入门</title>

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

        <script src="avalon.modern.js" type="text/javascript"></script>

        <script>

            var model = avalon.define({

                $id: "test",

                array: [{check: 1}, {check: 2}, {check: 3}],

                aaa: "999"

            })

        </script>

        <style>

            .ms-controller{

                visibility: hidden

            }

        </style>

    </head>

    <body>

        <div ms-controller="test" class="ms-controller">

            <div ms-repeat="array">

                {{el.check}}

            </div>

            <a ms-href="xxxx{{aaa}}.html">ddd</a>

        </div>

    </body>

</html>


双花括号也默认是python一些著名模板的界定符，为了防止冲突，我们有更换界定符的需求。这时我们可以这样做

<!DOCTYPE html>

<html>

    <head>

        <title>avalon入门</title>

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

        <script src="avalon.modern.js" type="text/javascript"></script>

        <script>

            avalon.config({

                interpolate: ["<!--","-->"]

            })

            var model = avalon.define({

                $id: "test",

                array: [{check: 1}, {check: 2}, {check: 3}],

                aaa: "999"

            })

        </script>

    </head>

    <body>

        <div ms-controller="test" class="ms-controller">

            <div ms-repeat="array">

                <!--el.check-->

            </div>

            <a ms-href="xxxx<!--aaa-->.html">ddd</a>

        </div>

    </body>

</html>

<!–与–>会生成一个注释节点，这样用户在网速慢时就看不到乱七八糟的内容了。当然这个也有风险，如果用户在页面上定义了许多注释，可以有搞混的问题。

我们再看下一个有用的配置项，debug。avalon默认是在控制台下打印没有调试消息的，上线时我们不愿用户看到它们，可以这样关掉它们。


avalon.config({debug: false})

avalon拥有自己的AMD加载器，如果你想用requirejs或seajs，那你得禁用自带的加载器，或像第一节建议的那样，直接在源码里面把它整个删掉。

  avalon.config({loader: false})

此外，avalon还有两个隐秘的配置项。

maxRepeatSize是用来配置ms-repeat循环绑定生成的代理节点所在的池子大小，目的是重复利用这些VM对象。默认是100。手机上对内存比较严重，可以将此阀值调少点。

 avalon.config({lmaxRepeatSize: 40})

dettachVModels是决定在事件绑定的this对象上添加$vmodels、 $vmodel属性。以前是默认添加的，现在是默认不添加，这是出于CG回收的考虑。并且在IE6-8下，为元素添加$vmodels属性不知为何会抛异常。看源码：

$vmodels、 $vmodel应该鲜为人知，大家不要管它们就是。此配置项也将在1.36中去掉。

迷你MVVM框架 avalonjs 学习教程17、avalon的一些配置项的更多相关文章

  1. 迷你MVVM框架 avalonjs 学习教程19、avalon历史回顾

    avalon最早发布于2012.09.15,当时还只是mass Framework的一个模块,当时为了解决视图与JS代码的分耦,参考knockout开发出来. 它的依赖收集机制,视图扫描,绑定的命名d ...

  2. 迷你MVVM框架 avalonjs 学习教程1、引入avalon

    avalon是国内最强大的MVVM框架,没有之一,虽然淘宝KISSY团队也搞了两个MVVM框架,但都无疾而终.其他的MVVM框架都没几个.也只有外国人与像我这样闲的架构师才有时间钻研这东西.我很早之前 ...

  3. 迷你MVVM框架 avalonjs 学习教程18、一步步做一个todoMVC

    大凡出名的MVC,MVVM框架都有todo例子,我们也搞一下看看avalon是否这么便宜. 我们先从react的todo例子中扒一下HTML与CSS用用. <!doctype html> ...

  4. 迷你MVVM框架 avalonjs 学习教程16、过滤器

    avalon的过滤器是参考自angular与rivets.它也被称做管道文本过滤器,它的处理对象只能是文本(字符串),它只能用在文本绑定中,并且只能是双花括号形式.下面是各大家的过滤器比较: rive ...

  5. 迷你MVVM框架 avalonjs 学习教程3、绑定属性与扫描机制

    在MVVM框架中,你都会看到页面定了许多奇怪的属性,比如knockout的data-☆,angular的ng-☆,avalon的ms-☆,此外还有一些只写文本节点上的双花括号,它们统称为指令.ms-☆ ...

  6. 迷你MVVM框架 avalonjs 学习教程22、avalon性能大揭密

    avalon之所以能在页面处理1W个绑定(angular对应的数字是2000),出于两个重要设计--基于事件驱动的双向绑定链及智能CG回收机制. avalon的双向绑定链是通过Object.defin ...

  7. 迷你MVVM框架 avalonjs 学习教程20、路由系统

    SPA的成功离开不这三个东西,分层架构,路由系统,储存系统.分层架构是我们组织复杂代码的关键,这里特指MVVM的avalon:路由系统是将多个页面压缩在一个页面的关键:储存系统特指本地储存,是安全保存 ...

  8. 迷你MVVM框架 avalonjs 学习教程11、循环操作

    avalon是通过ms-repeat实现对一组数据的批量输出.这一组数据可以是一个数组,也可以是一个哈希(或叫对象).我们先从数组说起吧. 第二节就说,凡是定义在VM中的数组,如果没有以$开头或者没放 ...

  9. 迷你MVVM框架 avalonjs 学习教程4、数据填充

    MVVM是前端的究极解决方案,你们可能用过jQuery,但那个写的代码不易维护:你们可以听过说requirejs与seajs,传说中的模块开发,加载器,但它们的最终目标是打包:你们可能听过unders ...

随机推荐

  1. bzoj 4484 [Jsoi2015]最小表示——bitset

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=4484 每个点上存一下它到每个点的连通性.用 bitset 的话空间就是 \( \frac{n ...

  2. Angular 4 路由守卫

    路由守卫 只有当用户已经登录并拥有某些权限时才能进入某些路由 一个有多个表单组成的向导,如注册流程,用户只有在当前组件的组件中填写了满足要求的信息才可以导航到下一个路由 当用户未执行保存操作而试图离开 ...

  3. android自定义tabhost,tabcontent用intent获得

    地址:http://my.oschina.net/aowu/blog/36282 自己改的自定义tabhost组建,效果图如左.有更好的朋友可以相互交流一下,嘿嘿. 1.先上AndroidManife ...

  4. BASIC-29_蓝桥杯_高精度加法

    题目: 问题描述 输入两个整数a和b,输出这两个整数的和.a和b都不超过100位. 算法描述 由于a和b都比较大,所以不能直接使用语言中的标准数据类型来存储.对于这种问题,一般使用数组来处理. 定义一 ...

  5. bzoj 1414: [ZJOI2009]对称的正方形

    Description Orez很喜欢搜集一些神秘的数据,并经常把它们排成一个矩阵进行研究.最近,Orez又得到了一些数据,并已经把它们排成了一个n行m列的矩阵.通过观察,Orez发现这些数据蕴涵了一 ...

  6. 基于jQuery的表单操作

    1,文本框的聚焦和失焦 在对文本框进行操作时,通常为了提升用户体验,是用户的操作得到及时的反馈,会在文本框获得焦点时,让其颜色改变,然后在失去焦点时恢复为原来的样式,一般情况下,我们可以通过css的伪 ...

  7. HTML5: input:file上传类型控制

    ylbtech-HTML5: input:file上传类型控制   1. 一.input:file 属性返回顶部 一.input:file属性 属性值有以下几个比较常用: accept:表示可以选择的 ...

  8. 杂项：Office Visio

    ylbtech-杂项:Office Visio Office Visio 是一款便于IT和商务人员就复杂信息.系统和流程进行可视化处理.分析和交流的软件.使用具有专业外观的 Office Visio ...

  9. Appium录制脚本520-2

    1.录制自动化脚本 场景:启动雪球,点击我的,登陆雪球,选择手机及其他登陆,输入手机号 2.使用Java进行测试Appium测试 2.1创建Java工程 file-创建maven工程-填写GroupI ...

  10. php如何判断IP为有效IP地址

    不需要正则表达式来判断,因为在php5.2.0之后,有专门的函数来做这个判断了. 判断是否是合法IP if(filter_var($ip, FILTER_VALIDATE_IP)) { // it's ...