unable to use handlebars @first data propriety in meteor

Question

I am rendering my past handlebars projects into a meteor app but it seems that there are @data properties that it doesn't support. Like @first which I used to create a reactive slideshow.

var carousel = [
    {
        film:"img_1.jpg",
        desc:"the first"
    },
    {
        film:"img_2.jpg",
        desc:"the second"
    },
    {
        film:"img_3.jpg",
        desc:"the third"
    }
];

Template.hello.helpers({net:carousel});

<div id="MyCarousel" class="carousel slide" data-ride="carousel">

    <div class="col-md-9">
        <ol class="carousel-indicators">
            <li id="data-target" data-slide-to="0" 
                             class="active"> </li>
            <li id="data-target" data-slide-to="1"> </li>
            <li id="data-target" data-slide-to="2"> </li>
        </ol>
      <div class="carousel-inner" role="listbox">
        {{#each net}}
        <div class="carousel {{@index}}">
          <img class="first-slide" alt="slide {{#if 
                $first}}active{{/if}}">
          <div class="container">
            <div class="carousel-caption">
              <div class="col-md-8">
                <h2>JAX 2015</h2>
                <hr/>
                <p>{{desc}}</p>
                </div>
                  <div class="col-md-4">
                    <div class="carousel-image">
                      <img src="{{film}}" alt="Slide Image" 
                               />
                    </div>
                  </div>
                </div>
              </div>
            </div>
           {{/each}}
        </div>
                .....
    </div>
  </div>

I wanted to know if there were ways to bypass the limitation through external packages or simply a js function.

Answer 1

3rd party package

There is a package called raix:handlebar-helpers, which implements helpers such as $last, etc. See: https://atmospherejs.com/raix/handlebar-helpers

Blaze built-in variable

Blaze has a built special variable @index, which can be used inside the body of #each to get the 0-based index of the currently rendered value in the sequence.

See http://blazejs.org/api/spacebars.html#Each for more details.

This would however require further work to implement the first / last helpers using this.