Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is there an after view change hook (much like didInsertElement)?

Tags:

ember.js

Using the didInsertElement hook, I'm able to do some jQuery plugin initialization that is needed. However, if a property changes, Ember re-renders the view, but does not call didInsertElement again. Presumably this is because the element is already on the DOM and only certain pieces have changed.

My question is, is there a method I can override, or some other way to access what's been rendered to the DOM by an Ember.View AFTER its actually inserted into the DOM?

I attempted to use afterRender, but it did not work.

like image 704
psylinse Avatar asked Mar 01 '12 04:03

psylinse


2 Answers

I came up with a slightly unusual way of tackling this problem. You can make a handlebars helper that fires an event when the view portion is re-rendered. I was using Bootstrap and jqPlot and needed to be able to tell, say, when the div was available to draw a chart into. With my helper you can do this:

{{#if dataIsLoaded}}
    {{trigger didRenderChartDiv}}
    <div id="chartHost"></div>
{{/if}}
like image 91
S'pht'Kr Avatar answered Nov 09 '22 12:11

S'pht'Kr


You could also hook into the childViews array and observe changes on that.

Something like this works but I don't think it's a good performance practice.

childViewsArrayDidChange: function() {
  console.log("childViews-Array did change");
}.observes('childViews.@each')
like image 35
Michael Klein Avatar answered Nov 09 '22 14:11

Michael Klein