javascript - dust.js 渲染动态内容

Question

我的模板中有以下代码，它在页面加载时提供所需的输出。

当我使用套接字更新数据时，有没有办法让灰尘动态呈现页面

{#storylines}
<li>{text|bl|s} <span class="badge yellow">{@negidx}{.}{/negidx}</span></li>    
{/storylines}

套接字 IO 代码：

socket.on('updatechat', function (username, data) {
       $('#newstoryline').before(blurlines(data));
});

我试过简单地添加<span class="badge yellow">{@negidx}{.}{/negidx}</span>到数据的末尾，但输出是{@negidx}{.}{/negidx}- 有没有办法让dust.js呈现最新数据？还是我必须使用某种 jQuery 而不是{@negidx}{.}{/negidx}？

Answer 1

If you are rendering your templates client-side, this should be easy. Your code would look something like this:

socket.on('updatechat', function (username, data) {
  if (data) {
    dust.render('storyline', data, function(err, output) {
      if (output) {
        $('#newstoryline').before(output);
      }
    });
  }
});

What's going on here:

The returned data should be JSON. Check that something has been returned.

  if (data) {

Use dust to render the template using the returned data.

    dust.render('storyline', data, function(err, output) {

Check for output:

  if (output) {

Insert the output into your page. This is usually done with innerHTML, but you can use whatever works for you. Remember, the output is a string at this point.

        $('#newstoryline').before(output);