Method didInsertElement not working

1

Hi everyone, I need to execute jquery code every time template is refreshed and for that I have created this:

 CCM_ROOT.HomeTemplateView = Ember.View.extend({
      templateName: 'HomeTemplate',
          didInsertElement: function() {
          alert();
      }
     });

and I am updating my hometemplate using polling and below is the coding for same:

CCM_ROOT.HomeTemplateRoute = Ember.Route.extend({
model: function(){
	return this.store.find('agent');
},	
recursive: function() {
	this.model();
	this.set('poll',Ember.run.later(this,function(){this.recursive();},5000));
},
setupController : function(controller, model)
{
	this.controllerFor('homeTemplate').set('model',model);
	this.controllerFor('homeTemplate').changeTheHeader();
	this.recursive();
},
deactivate : function(){
	Ember.run.cancel(this.get('poll'));
}

});

Issue: didInsertElement() is called when I reload the page. But I require it to fire every time when template is updated.

2

Hey @gsharma, its a bit late answer but maybe someone else needs it.

You should prefer didRender function because unlike didInsterElement works only once, it works everytime after re-render.

3

Please note that Ember.View has been removed in 2.0 years ago. @ember/component had similar didInsertElement and didRender hooks. While not being deprecated (yet), it’s recommended to use @glimmer/component instead for new components. It does not have these component hooks. You should use modifiers instead. @ember/render-modifiers provide a similar functionality as these lifecycle hooks before. But it’s recommended to use custom modifiers instead if possible. Such a modifier could register a jQuery plugin on an element and update it when one of the arguments is changed.