Skip to content

Serabe/ember-bind-helper

Repository files navigation

Ember Bind Helper

CircleCI Ember Observer Score Code Climate dependencies Status

This addon provides a bind helper to bind a function to a context.

Installation

If you are running Ember 3.4+, just ember install ember-bind-helper.

If you are running a version older than 3.4, do ember install [email protected] instead.

Using bind

Let's say we want to call a method of an object when we click a function. We might think of doing the following:

<button onclick={{action myObject.myMethod}}>
  My Button
</button>

Sadly, this might not work as expected, given that the context would be the controller (twiddle). To solve this, you can use the bind helper:

<button onclick={{bind myObject.myMethod}}>
  My Button
</button>

This automagically sets the context to myObject. If the method were myObject.mySubobject.myMethod it would bind it to myObject.mySubobject and so on. The only exception to this rule is that if the last part of the chain before the method name is actions, it gets removed too:

<button onclick={{bind myObject.actions.myMethod}}>
  My Button
</button>

This sets the context to myObject. Normally it would have been myObject.actions but, given the last part is actions, ember-bind-helper removes that too leaving only myObject.

You can explicitly set the target by adding a named argument target:

<button onclick={{bind myObject.mySubobject.myMethod target=myObject}}>
  My Button
</button>

bind also passes any extra parameters to the binding function. Thus, when we click this button:

<button onclick={{bind myMethod 1 2 3 "caramba"}}>
  My Button
</button>

myMethod will receive 1, 2, 3 and "caramba" as arguments.

Linting

  • npm run lint:hbs
  • npm run lint:js
  • npm run lint:js -- --fix

License

This project is licensed under the MIT License.