ember view event when data loaded

Question

I have this Ember View code:

{{#view "tabla"}}
    <table>
        ...
    </table>
{{/view}}

and I need to run a javascript code to the HTML table after the data from an asynchronous call is rendered.

I tried to do this:

App.TablaView = Ember.View.extend({
didInsertElement : function() {
    Ember.run.scheduleOnce('afterRender', this, function() {
       javascript code..
     });
 }

but it is executed when the table is rendered without data.

I also tried to call the javascript code in the callback of my asynchronous function, but the data was not rendered to the view yet.

Is there any event triggered after the binding is executed?

Thanks!

Answer 1

I had somewhat the same issues and I ended up fixing it like this:

didInsertElement: function() {
    _this = this;
    if (this.get('element').addEventListener) {
       this.get('element').addEventListener ('DOMNodeInserted', function() {
          Ember.run.scheduleOnce('afterRender', _this, function() {
              javascript code..
          });
       }, false);
    }
   //for images
   $( "img",this.$()).load(function() {
   Ember.run.scheduleOnce('afterRender', _this, function() {
          javascript code..
     });
   });
}

be aware that in this solution your "javascript code.." code could be called (and executed) multiple times. That wasn"ta problem in my case but it could be an issue in yours.