1

我正在尝试在浏览器中使用带有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 的机器上提供。我实际上是在我的台式机上本地工作。是这样吗？

4

1 回答 1

1

dust.loadSource当您提供预编译模板时，您实际上不需要调用。在内部，dust.loadSource只需eval对dust.compile. 如果删除该dust.loadSource行，您的模板应该会正确呈现。

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

于 2013-03-02T23:10:16.370 回答