Meteor 0.8.0: While building the application: Unexpected closing template tag

Question

I have this section in my template, the unexpected closing template tag is the {{/if}}.

{{#if selected}}
  <div class="Answer--selected">
{{else}}
  <div class="Answer">
{{/if}}
    <i class="fa"></i> {{title}}
  </div>

What is wrong with this code?

Answer 1

I had my question answered at Meteor Devshop. One of the breaking changes in Meteor 0.8.0 is the new templating system called Blaze, which renders your templates in a fundamentally new way. Instead of re-generating the whole HTML fragment every time the template renders itself, Blaze finds only the DOM nodes that need to be updated and performs the minimum possible changes. This means that you're not allowed to have unclosed HTML tags inside of block helpers anymore.

So the corrected code looks like:

{{#if selected}}
  <div class="Answer--selected">
    <i class="fa"></i> {{title}}
  </div>
{{else}}
  <div class="Answer">
    <i class="fa"></i> {{title}}
  </div>
{{/if}}

HTH

Answer 2

I believe this will work as well if you just want to alter the class name based on the condition.

<div class="{{#if selected}}Answer--selected{{else}}Answer{{/if}}">
    <i class="fa"></i> {{title}}
</div>

As long as you don't bust apart tag begin/end with your helper you should be okay.

Steve