javascript - jQuery.handlebars 模板未在动态 DOM 附加上呈现

Question

我一直在使用动态 DOM 附加来初始化我的应用程序，使用 jQuery.handlebars 作为模板库。但是 jQuery.handlebars 的问题在于它不会将模板呈现给动态调用的 DOM。例子

   $(document).ready(function(){
         $('body').append('<div id="content"></div>');
         $('#content').render('default', {

         });
   )};

default 是模板文件 default.hbs，所有模板路径都已正确初始化。

但它适用于

索引.html

    <div id="#content"></div>

jQuery文件

    $('#content').render('default', {

    });

jQuery.handlebars 的另一个问题是它没有使用 jQuery 在模板中附加任何元素。例子

默认.hbs

    <div id="#append-content"></div>

jQuery代码

     $('#append-content").html('Hi');

但内容“嗨”没有出现。

这有点令人困惑，如果它错了，或者如果对 jQuery.handlebars 的使用有任何反对意见，请指教，请建议一个新的模板库。

Answer 1

jquery.handlebars 渲染方法是异步的。您正在尝试在渲染完成之前附加到容器。render 方法在完成渲染时触发“render.handlebars”事件。在回调中进行 DOM 操作。

$('#content').render('template', {

}).on('render.handlebars', function() {
  $('#append-content').html("hello");
});