Manipulate an element that is conditionally rendered

Issue

I'm fixing a bug on some legacy Angular 1.5 code.

I have a template like this

<div id="container" ng-if="ctrl.show_container">
  <div id="child"></div>
</div>

I need to manipulate the div#child. I'm using $element.find() to get the child div. Unfortunately, it seems that code runs before the template/DOM has finished rendering -- due to the conditional rendering on the container, it doesn't find anything. If I remove the ng-if, it's able to find the element as expected.

Is there any way I can execute my DOM manipulation until after all the conditional rendering is done?

Thank you

Solution

  scope.$watch('$viewContentLoaded', functionToManipulateDom)

Answered By - user2183384