DustJs - 访问不同的数据

Question

我正在使用 Dustjs 并尝试以两种不同的方式编译、加载和呈现模板：基本上是使用浏览器和 Node（因此在客户端和服务器端）用于单个网页。

我试过类似的东西：
index.js 文件:

var      fs = require('fs');
var    path = require('path');
var express = require('express');
var    dust = require('dustjs-linkedin');

var app = express();

app.get('/', function(req, res) {

    res.writeHead(200, {"Content-Type": "text/html"});

    var src = fs.readFileSync(path.join(__dirname, 'hello.dust'), 'utf8'),
        compiled = dust.compile(src, 'hello');
    dust.loadSource(compiled);
    dust.render('hello', { world: "earth" }, function(err, out) {
      res.write(out);
    });

    res.end();
});
app.listen(80);

hello.dust 文件:

[...]

    Hello {world}!<br/>
    <p id="output"></p>

    <script type="text/javascript" src="js/dust-full.min.js"></script>
    <script type="text/dust" id="test">Hello {firstName}!</script>
    <script type="text/javascript">
        (function(){
            var src = document.getElementById('test').textContent,
                compiled = dust.compile(src, 'test');
            dust.loadSource(compiled);
            dust.render('test', { firstName: "John" }, function(err, out) {
              document.getElementById('output').textContent = out;
            });
        })();
    </script>

[...]

但这是我得到的：

Hello earth!
Hello !

我做了一些研究：模板 "test" 无法访问给定的 'firstName'，但仍然可以访问 'world'.
我试图围绕 'firstName' 设置上下文并通过 {#test} 访问，但它不起作用。
我也试过这样写数据（也没用）：

(function(){
    var context = dust.context(null, {"test": { "firstName": "John" }});
}())

我想要这个：

Hello earth!
Hello John!

有人可以向我解释一下我是从尘土开始的吗？

Answer 1

服务器正在处理嵌入的模板 -- 它无法判断模板是否在脚本标记内。

解决问题的真正方法是将 JavaScript 与模板分离，而不是将其嵌入内联。但是，如果您必须这样做，则需要转义嵌入的模板。

{` Hello {firstName}! `}

这将导致服务器跳过括号内内容的渲染，以便客户端能够读取模板。

不过，您确实应该预编译模板。

DustJs - 访问不同的数据

DustJs - Access to different data

node.js

express

dust.js