Meteor Meter：在Blaze中嵌入模板

使用Bootstrap和Meteor/Blaze，我试图使用模板助手动态控制模板的大小。我想要一个按钮在col-md-4和col-md-12之间切换。硬编码列大小如下所示：

<div class="panel-body">
  <div class="row">
   {{#each articles}}
      <div class="col-md-4">
         {{> article this}}
      </div>
   {{/each}}
 </div>

{{#每篇文章}
{{>这篇文章}
{{/每个}}

我有一个模板助手，它返回div，发现我需要一个结束助手调用，否则Meteor可能会抱怨不平衡。这似乎有点老套

Template.articles.helpers({
  format: function() {
      return '<div class="col-md-4">';
      // return '<div class="col-md-12">';
  },
  end_format: function() {
      return '</div>'
  }
});

Template.articles.helpers({
格式：函数（）{
返回“”；
//返回“”；
},
end_格式：函数（）{
返回“”
}
});

标记为：

<div class="panel-body">
  <div class="row">
      {{#each articles}}
          {{{format}}}
              {{> article this}}
          {{{end_format}}}
      {{/each}}
   </div>
</div>

{{#每篇文章}
{{{format}}}
{{>这篇文章}
{{{end_format}}}
{{/每个}}

但是div标记返回时是关闭的和空的，下面是我希望包含的标记，如此屏幕截图所示：

---

不要从模板帮助程序返回HTML，通常有更好的方法

为什么不从模板帮助器返回动态类名呢

HTML

<div class="panel-body">
  <div class="row">
    {{#each articles}}
      <div class="{{columnSize}}">
        {{> article this}}
      </div>
    {{/each}}
  </div>
  <button type="button" class="btn btn-primary js-toggle-column-size">Toggle column size</button>
</div>

Template.articles.onCreated(function(){
  this.largeColumns = new ReactiveVar(false);
});

Template.articles.helpers({
  columnSize(){
    const largeColumns = Template.instance().largeColumns.get();
    return largeColumns ? 'col-md-12' : 'col-md-4';
  }
});

Template.articles.events({
  'click .js-toggle-column-size'(event, template){
    const largeColumns = template.largeColumns.get();
    template.largeColumns.set(!largeColumns);
  }
});