迷你MVVM框架 avalonjs 学习教程17、avalon的一些配置项

浏览数：42 / 时间：2015年06月09日

本章节，主要是介绍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默认是在控制台下打印没有调试消息的，上线时我们不愿用户看到它们，可以这样关掉它们。