meteor-template-helpers

Useful template helpers.

Included helpers:

• Template - access to current Template.instance()
• settings - access to Meteor.settings.public
• session - access to Session
• imageLoaded - check whether the image is loaded.
• imageLoading - check whether the image is in the process of loading.

Install

meteor add sunstory:meteor-template-helpers

Use

Template:

  Template.example.onCreated ->
    @instanceVariable = 'one'
    @reactiveVariable = new Blaze.ReactiveVar
    @reactiveDict = new ReactiveDict
    @instanceObject = 
      first: 'Mercury'
      second: 'Venus'

    Meteor.call 'someMethod', =>
      @reactiveVariable.set 'two'
      @reactiveDict.set 
        foo: 'three'
        bar: 'four'

  <template name="example">
    <p>instanceVariable is {{Template 'instanceVariable'}}</p>
    <p>reactiveVariable is {{Template 'reactiveVariable'}}</p>
    <p>reactiveDict foo is {{Template 'reactiveDict' 'foo'}}</p>
    <p>reactiveDict bar is {{Template 'reactiveDict' 'bar'}}</p>

    {{#with Template 'instanceObject'}}
      <p>{{first}}</p>
      <p>{{second}}</p>
    {{/with}}
  </template>

settings:

  {
    "public": {
      "twitterName": "elonmusk",
      "twitterUrl": "https://twitter.com/elonmusk"
    }
  }

  <p>nickname is {{settings 'twitterName'}}</p>
  <p>nickname is {{settings 'twitterUrl'}}</p>

  {
    "public": {
      "twitter": {
        "name": "elonmusk",
        "url": "https://twitter.com/elonmusk"
      }
    }
  }

  {{#with settings}}
    <p>nickname is {{twitter.name}}</p>
    <p>url is {{twitter.url}}</p>
  {{/with}}

session:

  Session.set('planet', 'Earth')

  <p>planet is {{session 'planet'}}</p>

  Session.set('planets', { first: 'Mercury', second: 'Venus' })

  {{#with session 'planets'}}
    <p>first is {{first}}</p>
    <p>second is {{second}}</p>
  {{/with}}

imageLoaded, imageLoading:

  {{#if imageLoading imageUrl}}
    ... spinner ...
  {{else}}
    <img src="{{imageUrl}}">
  {{/if}}

  {{#if imageLoaded imageUrl}}
    <img src="{{imageUrl}}">
  {{/if}}

Changelog

• 19 Oct 2015: added imageLoaded and imageLoading helpers.