Suppose a pure AngualrJS (1.6.x) controller declared using ng-controller
directive (in contrary to a component controller).
Does it have lifecycle hooks like $onInit
or $onDestroy
?
According to the section Scope Life Cycle in the scope documentation (v1.6.10) there are not such hooks (using the ng-controller
approach).
The scope lifecycle would go like this:
The root scope is created during the application bootstrap by the $injector
. During template linking, some directives create new child scopes.
During template linking, directives register watches on the scope. These watches will be used to propagate model values to the DOM.
For mutations to be properly observed, you should make them only within the scope.$apply()
. AngularJS APIs do this implicitly, so no extra $apply
call is needed when doing synchronous work in controllers, or asynchronous work with $http
, $timeout
or $interval
services.
At the end of $apply
, AngularJS performs a $digest
cycle on the root scope, which then propagates throughout all child scopes. During the $digest
cycle, all $watched
expressions or functions are checked for model mutation and if a mutation is detected, the $watch
listener is called.
When child scopes are no longer needed, it is the responsibility of the child scope creator to destroy them via scope.$destroy()
API. This will stop propagation of $digest
calls into the child scope and allow for memory used by the child scope models to be reclaimed by the garbage collector.
Of course, alternatively, you can always use $rootScope.Scope#$on
for listening for changes.
Examples:
$scope.$on('my-custom-event', function () {
// some code to execute when my-custom-event is fired
});
$scope.$on('$destroy', function () {
// some code to execute when the scope is destroyed
});