Bind function on template creation in Ember.js

Question

I have a Handlebars template that needs to have a javascript function run on its creation. Is this possible in Ember/handlebars? Specifically, it is a partial that creates a "status bar" with a percentage and a certain amount of the bar filled up. I already have a working function for this, I just need a way to have it run for all the status bars (there are many on the page) when they load.

Answer 1

I would wrap your progress bars in an ember component. Then use didInsertElement to trigger your function. Additionally you could scope to that particular progress bar instance.

App.ProgressBarComponent = Em.Component.extend({
  someFunc: function(){
    this.myFunc();
  }.on('didInsertElement'),
  myFunc: function(){
    console.log('this component is', this.$());
  }
});