Question

我需要在一个事件上创建一些HTML。现在我通过使用JQuery来做到这一点。

Template.example.onRendered(function() {
    paper.on({
        'cell:mouseover': function(cellView, event){
            // create HTML construction
            $('<div/>', { id: 'toolbar' })
                .attr('data-id', cellId)
                .addClass(type)
                .css({
                    width: size.width + 'px',
                    top: pos.y + 'px',
                    left: pos.x + 'px'  
                })
                .appendTo('#canvas');
            // and so on...
    });
});

但是当我使用meteor时，我认为使用模板会更聪明 - 如果我想使用的HTML会变得更复杂。

那么如何将模板添加到由事件函数触发的DOM中呢？

Answer 1

如果是单个html块，您可以使用空格键{{#if myHelper}}。您可以使用reactive dict或reactive var包将反应变量标记添加到页面（在js文件的开头），并在事件中将其设置为true。帮助者myHelper将返回它并触发模板的显示。
如果您需要生成与收到活动一样多的html块，可以使用Blaze.render()或Blaze.renderWithData()将生成的模板附加到DOM节点。将名为GeneratedTemplate的模板附加到标识为your_dom_node的DOM节点的示例：
```
Blaze.renderWithData(Template.GeneratedTemplate, 
    {
     "arg1":"something", 
     "arg2": "whatever"
     }, 
     $("#your_dom_node")[0]
     );
```

Answer 2

那么如何将模板添加到由事件函数触发的DOM中呢？

我们假设我们使用＆＃39;提交＆＃39;表格中的事件。你可以这样继续：

Template.body.events({
   "submit .classname-of-my-btn": function(event){}
)};

meteor：使用模板通过事件添加一些HTML

2 个答案: