Search code examples
angularjsangularjs-directiveangularjs-scopeangular-ng-if

Manipulate an element that is conditionally rendered


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)