Ember.Handlebars Class


Module: ember-htmlbars

Show:

Methods

Show:

bootstrap

(ctx) private static

Find templates stored in the head tag as script tags and make them available to Ember.CoreView in the global Ember.TEMPLATES object. This will be run as as jQuery DOM-ready callback.

Script tags with text/x-handlebars will be compiled with Ember's Handlebars and are suitable for use as a view's template. Those with type text/x-raw-handlebars will be compiled with regular Handlebars and are suitable for use in views' computed properties.

Parameters:

ctx

get

(root, path, options) deprecated public

Lookup both on root and on window. If the path starts with a keyword, the corresponding object will be looked up in the template's data hash and used to resolve the path.

Parameters:

root Object
The object to look up the property on
path String
The path to be lookedup
options Object
The template's option hash

makeBoundHelper

(fn, dependentKeys) deprecated private

A helper function used by registerBoundHelper. Takes the provided Handlebars helper function fn and returns it in wrapped bound helper form.

The main use case for using this outside of registerBoundHelper is for registering helpers on the container:

1
2
3
4
5
var boundHelperFn = Ember.Handlebars.makeBoundHelper(function(word) {
  return word.toUpperCase();
});

container.register('helper:my-bound-helper', boundHelperFn);

In the above example, if the helper function hadn't been wrapped in makeBoundHelper, the registered helper would be unbound.

Parameters:

fn Function
dependentKeys String

registerBoundHelper

(name, fn, dependentKeys) private

Register a bound handlebars helper. Bound helpers behave similarly to regular handlebars helpers, with the added ability to re-render when the underlying data changes.

Simple example

1
2
3
Ember.Handlebars.registerBoundHelper('capitalize', function(value) {
  return Ember.String.capitalize(value);
});

The above bound helper can be used inside of templates as follows:

1
{{capitalize name}}

In this case, when the name property of the template's context changes, the rendered value of the helper will update to reflect this change.

Example with options

Like normal handlebars helpers, bound helpers have access to the options passed into the helper call.

1
2
3
4
5
6
7
8
Ember.Handlebars.registerBoundHelper('repeat', function(value, options) {
  var count = options.hash.count;
  var a = [];
  while(a.length < count) {
      a.push(value);
  }
  return a.join('');
});

This helper could be used in a template as follows:

1
{{repeat text count=3}}

Example with bound options

Bound hash options are also supported. Example:

1
{{repeat text count=numRepeats}}

In this example, count will be bound to the value of the numRepeats property on the context. If that property changes, the helper will be re-rendered.

Example with extra dependencies

The Ember.Handlebars.registerBoundHelper method takes a variable length third parameter which indicates extra dependencies on the passed in value. This allows the handlebars helper to update when these dependencies change.

1
2
3
Ember.Handlebars.registerBoundHelper('capitalizeName', function(value) {
  return value.get('name').toUpperCase();
}, 'name');

Example with multiple bound properties

Ember.Handlebars.registerBoundHelper supports binding to multiple properties, e.g.:

1
2
3
4
Ember.Handlebars.registerBoundHelper('concatenate', function() {
  var values = Array.prototype.slice.call(arguments, 0, -1);
  return values.join('||');
});

Which allows for template syntax such as {{concatenate prop1 prop2}} or {{concatenate prop1 prop2 prop3}}. If any of the properties change, the helper will re-render. Note that dependency keys cannot be using in conjunction with multi-property helpers, since it is ambiguous which property the dependent keys would belong to.

Use with unbound helper

The {{unbound}} helper can be used with bound helper invocations to render them in their unbound form, e.g.

1
{{unbound capitalize name}}

In this example, if the name property changes, the helper will not re-render.

Use with blocks not supported

Bound helpers do not support use with Handlebars blocks or the addition of child views of any kind.

Parameters:

name String
fn Function
dependentKeys String