dustjs 渲染客户端不工作
dustjs rendering client-side not working
在 Expressjs 4 中使用 dustjs 作为模板引擎。想要在用户填写表单并使用 xhr 单击搜索按钮时在客户端呈现模板。就从 xhr 调用中获取 json 而言,一切似乎都很好,但 dust.render 没有呈现结果。
页面上的灰尘模板如下:
<script id="result-template">
// 为简洁起见,删除了额外的 table 标签
{#search_results}
{名字}
{lname}
{帐户ID}
{电子邮件}
{地位}
{/search_results}
脚本>
下面是外部 js 文件中的 js/jquery 对服务器端进行 xhr 调用。在成功回调中,我试图呈现调用结果,基本上是用户填写搜索表单并单击提交:
$(document).ready(function () {
$('#main').on('click', '#search-btn', function (e) {
e.preventDefault();
$.ajax({
url: '/support/search/ah',
type: "post",
headers: {token: sessionStorage.getItem('somekey')},
data: {'phone': $('#mobile').val(),
'email': $('#email').val(),
'fname': $('#fname').val(),
'lname': $('#lname').val()
},
success: function (data, textStatus, request) {
var source = $("#result-template").html();
var compiled = dust.compile(source, "intro");
dust.loadSource(compiled);
dust.render("intro", data, function(err, out) {
$("#output").html(out);
$('#search-result').dataTable();
});
},
error: function (data, textStatus, request) {
// handle error
})
})
xhr 调用成功,我可以看到 'data' 变量包含 json 和值,但是,我无法使用 dust.render 呈现它们并且有页面加载或结果返回时没有观察到 js 错误。
这是 xhr 调用的 json 结果:
{"search_results":[{"fname":"Duke", "lname":"Wellington","accountId":"007","email":"duke_wellington","status":"Breathing"}]};
我在 atakdubya.github.io 尝试了具有相同 json 结果的相同模板替换它的数组示例,它工作正常。
如果有人能指出我做错了什么,将不胜感激。
根据您的浏览器,您不能有没有 type
的 script
标签,否则它将被解释为 Javascript,并且 Dust 无效 Javascript.
尝试将 type="text/dust"
添加到您的 script
标签。这个 JSFiddle 对我有用。
在 Expressjs 4 中使用 dustjs 作为模板引擎。想要在用户填写表单并使用 xhr 单击搜索按钮时在客户端呈现模板。就从 xhr 调用中获取 json 而言,一切似乎都很好,但 dust.render 没有呈现结果。
页面上的灰尘模板如下:
<script id="result-template"> // 为简洁起见,删除了额外的 table 标签 {#search_results} {名字} {lname} {帐户ID} {电子邮件} {地位} {/search_results} 脚本>下面是外部 js 文件中的 js/jquery 对服务器端进行 xhr 调用。在成功回调中,我试图呈现调用结果,基本上是用户填写搜索表单并单击提交:
$(document).ready(function () { $('#main').on('click', '#search-btn', function (e) { e.preventDefault(); $.ajax({ url: '/support/search/ah', type: "post", headers: {token: sessionStorage.getItem('somekey')}, data: {'phone': $('#mobile').val(), 'email': $('#email').val(), 'fname': $('#fname').val(), 'lname': $('#lname').val() }, success: function (data, textStatus, request) { var source = $("#result-template").html(); var compiled = dust.compile(source, "intro"); dust.loadSource(compiled); dust.render("intro", data, function(err, out) { $("#output").html(out); $('#search-result').dataTable(); }); }, error: function (data, textStatus, request) { // handle error }) })
xhr 调用成功,我可以看到 'data' 变量包含 json 和值,但是,我无法使用 dust.render 呈现它们并且有页面加载或结果返回时没有观察到 js 错误。
这是 xhr 调用的 json 结果:
{"search_results":[{"fname":"Duke", "lname":"Wellington","accountId":"007","email":"duke_wellington","status":"Breathing"}]};我在 atakdubya.github.io 尝试了具有相同 json 结果的相同模板替换它的数组示例,它工作正常。
如果有人能指出我做错了什么,将不胜感激。
根据您的浏览器,您不能有没有
type
的script
标签,否则它将被解释为 Javascript,并且 Dust 无效 Javascript.尝试将
type="text/dust"
添加到您的script
标签。这个 JSFiddle 对我有用。