How do I properly implement Bootstrap carousel in Meteor?

Question

I'm migrating some code to blaze and have hit a problem with the bootstrap carousel that I can't seem to get over.

I had the following pre blaze to set one of the carousel items active to kick the whole thing off

<div class="item {{#if active_sponsor}}active{{/if}}">

As documented, this no longer works with blaze, so I've tried modifying it to the only thing I can think of which is

{{#if active_sponsor}}
  <div class="item {{#if active_sponsor}}active{{/if}}">
{{else}}
  <div class="item">
{{/if}}

This all lives within an {{each sponsors}} block.

Sadly, this fails to run with an error saying unexpected {{else}} (or, if I remove the {{else}} unexpected {{/if}}

What's the correct way to do this. I'm using exactly the same pattern earlier to change a

Answer 1

From "Using Blaze" on github :

https://github.com/meteor/meteor/wiki/Using-Blaze#conditional-attributes-with-no-value-eg-checked-selected

So you should use this form instead, assuming that active_sponsor is the property to look for in the current data context.

Template.whatever.helpers({
    isActive:function(){
        return this.active_sponsor?"active":"";
    }
});

<div class="item {{isActive}}">
</div>