How to track when Angular has rendered a view?

Question

Angular

Hello! The situation is as follows: there is a need to perform some manipulations with the dom using jQuery, the problem is that the manipulations are performed with the elements that Angular renders and if you initialize the jquery script right away, then nothing works, because Angular is late with rendering, so you have to use $timeout' You want everything to happen in the right order.
The question is how to track the moment when Angular has rendered all the elements and call the initialization of the jq script on such an event?

Answer 1

Make a separate controller and view under the piece on which jQuery needs to be run.
In this controller, run jQuery. At this point, the template is already rendered.

<div ng-include="'app/someView.html'" ng-controller="someController"></div>

Answer 2

There is an undocumented $scope.$$postDigest function that registers a callback function that will be called after the end of the $digest loop (it will work once, when the next $digest loop ends).
I usually have the following scheme:
1. An action was performed that caused the view to be redrawn (the $digest cycle began)
2. In the process of processing the action, I register the function via $$postDigest
3. All changes are fixed in the DOM, the $digest cycle is over, the function from the item 2 worked - everyone is happy

Answer 3

You can try adding ng-init="runMyFunc()" to the DOM, when runMyFunc is called, the DOM should already be in place.

Answer 4

In my opinion Directives and their function are linkcreated for these things. If you use components, then they have a lifecycle method$postLink()