在流星中动态插入模板

Question

好的,我的模板名为myApp.html.我的模板代码如下

<template name="initialInsertion">
  <div class="greeting">Hello there, {{first}} {{last}}!</div>
</template>

现在,我想在单击按钮时将此模板插入DOM.我已经在DOM中呈现了我的按钮,我有一个与之关联的点击事件,如下所示

Template.chooseWhatToDo.events = {
  'click .zaButton':function(){
     Meteor.ui.render(function () {
       $("body").append(Template.initialInsertion({first: "Alyssa", last: "Hacker"}));
     })
  }
}

现在显然$("body").append part是错误的,但返回Template.initialInsertion ...不会将该模板插入DOM.我尝试过放置一个partia {{> initialInsertion}},但这只是错误,因为我没有第一个也没有最后一个设置......任何线索？多谢你们

Answer 1

在meteor 1.x中

'click .zaButton':function(){
   Blaze.renderWithData(Template.someTemplate, {my: "data"}, $("#parrent-node")[0])
 }

在流星0.8.3

'click .zaButton':function(){
   var t = UI.renderWithData(Template.someTemplate, {my: "data"})
   UI.insert(t, $(".some-parrent-to-append"))
 }

Answer 2

最后是第一次也是最后一次进入Meteor.Collection？

如果没有,我所知道的最简单的方法是将数据放入会话中:

Template.chooseWhatToDo.events = {
    'click .zaButton' : function () {
         Session.set('first', 'Alyssa');
         Session.set('last', 'Hacker');
    }
}

然后你会定义:

Template.initialInsertion.first = function () {
  return Session.get('first');
}

Template.initialInsertion.last = function () {
  return Session.get('last');
}

Template.initialInsertion.has_name = function () {
  return Template.initialInsertion.first() && Template.initialInsertion.last();
}

最后,像这样调整你的.html模板:

<template name="initialInsertion">
    {{#if has_name}}
        <div class="greeting">Hello there, {{first}} {{last}}!</div>
    {{/if}}
</template>

这是你的问题的完全相反的解决方案,但它似乎是"流星方式".(基本上,不要担心自己操纵DOM,只需拥抱会话,集合和模板系统.)顺便说一下,我还是Meteor的新手,所以如果这不是"Meteor方式",请有人告诉我:-)