Add class after didRender()


I’m trying to animate a component into view by setting an ‘isActive’ property to true in the didRender() method, and watching for isActive in the component’s classNameBindings, then adding a class which, combined with a css transition, should move the component into the viewport.

The problem is that the class seems to have been added precisely at-the-time the component was rendered, so the transition doesn’t occur (the component is rendered already at its final location). Is there a better way to achieve what I want than sticking it in a setTimeout?


I got what I wanted using (although I’m still interested to hear if this would be the preferred way):

didRender() {
  this._super(...arguments); => {
    this.set('isActive', true);

#3'afterRender', this, function() {
  this.set('isActive', true);

This schedules it after the render queue, which should give you the hook you need.


Thanks, @jasonmit – that’s still adding the class too early, though (so the element just appears, rather than being animated in). appears to be doing the trick for now.