在浏览器中调用dust.loadSource()时,编译的模板引用是未定义的

时间:2013-03-02 22:29:41

标签: javascript dust.js

我正在尝试使用带有dust.js的编译模板在浏览器中呈现HTML(而不是服务器端带有node.js)。如果我在客户端javascript中编译模板,它工作正常。如果我预编译模板并将其作为建议的脚本标记包含在内,则dust.loadSource语句会导致Chrome调试器说:“未捕获的ReferenceError:nowork未定义”,其中“nowork”是模板名称。所以......

此HTML和脚本有效:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>This Works</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script src="dust-full-0.3.0.min.js"></script>
</head>
<body>
    <div id="bingo"></div>
    <script type="text/javascript">
        var templateKey = 'works';
        var myView = {"people":[{"name":"Fred"},{"name":"Harry"},{"name":"Linda"},{"name":"Mary"}]};

        dust.loadSource(dust.compile("{#people}<br/>{name}{/people}", templateKey));
        dust.render(templateKey, myView, function(err, out) {
            $('#bingo').html(out);
        });
    </script>
</body>
</html>

但这不是:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>This Doesn't Work</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script src="dust-full-0.3.0.min.js"></script>
    <script type='text/javascript' src="nowork.js"></script>
</head>
<body>
    <div id="bingo"></div>
    <script type="text/javascript">
        var templateKey = 'nowork';
        var myView = {"people":[{"name":"Fred"},{"name":"Harry"},{"name":"Linda"},{"name":"Mary"}]};

        dust.loadSource(templateKey);
        dust.render(templateKey, myView, function(err, out) {
            $('#bingo').html(out);
        });
    </script>
</body>
</html>

包含的nowork.js文件包含:

(function() {
    dust.register("nowork", body_0);

    function body_0(chk, ctx) {
        return chk.section(ctx.get("people"), ctx, {
            "block": body_1
        }, null);
    }
    function body_1(chk, ctx) {
        return chk.write("<br/>").reference(ctx.get("name"), ctx, "h");
    }
    return body_0;
})();

有人可以帮忙吗?

我刚才意识到,这可能是由于这些文件未在安装了node.js的计算机上提供。我实际上是在我的台式机上本地工作。是吗?

1 个答案:

答案 0 :(得分:1)

在提供预编译模板时,实际上不需要调用dust.loadSource。在内部,dust.loadSource只对eval返回的JavaScript字符串执行dust.compile。如果您移除dust.loadSource行,则应正确呈现模板。

Node.js对于您在此处尝试的内容不是必需的。事实上,也不需要满尘。如果你正在做的只是在客户端渲染,你可以使用dust-core。