1.5 Feature: Backport ngOnDestroy (as $onDestroy for example) exactly as ngOnInit ($onInit)

[radek-anuszewski]

In new 1.5.0 release is possible to use $onInit hook which is similar to ngOnInit from Angular 2 lifecycle hooks. It will help with keeping controller's constructors clean, with initialization logic moved to the $onInit method.
I think worth consideration is backport also ngOnDestroy, as $onDestroy for example.

Use Case:

In recent project in my company on of the business rules is to send request to device every second (which we have done with timeouts). We try to stay away as possible from injecting $scope to controllers, but timeouts needs to be cleared when user opens new view or hits back button on mobile device etc... So we solved this with $scope.$on:

$scope.$on('$destroy', function () {
      viewModel.removeIntervals();
});

And it's only one direct usage of $scope at this moment. If we have $onDestroy hook, code would be like:

viewModel.$onDestroy =  function () {
      viewModel.removeIntervals();
});

And we can get rid off $scope injection completely. Also, it let us keep code closer to Angular 2 syntax.

Thank you in advance for looking on this post.

Best regards,
Radek.

[dcherman]

👏 , would love to have something like this.

[shlomiassaf]

We have a workaround for this, i'll share it.
We use it until it will be supported and it works quite well.

We register our first run block and request the $injector service.
We monkey patch the $injector.instantiate method and inside register the $onDestory event, if needed.

angular.module('app').run(['$injector', function($injector) {
    var $instantiate = $injector.instantiate;
    $injector.instantiate = function (Type, locals, serviceName) {
        var instance = $instantiate.call(this, Type, locals, serviceName);
        if (instance.$onDestroy && typeof instance.$onDestroy === 'function') && locals && locals.$scope) {
            locals.$scope.$on('$destroy', function() {instance.$onDestroy()});
        }
        return instance;
    }
}]);

This is a very simple example of the idea, I converted it real time from TypeScript and removed internal utils so I hope its correct.

Some notes:

Its important to note that it will not work on "child" injectors, i.e injectors created using angular.injector factory, to support it angular.injector should be monkey patched as well, returning a monkey patched version of the injector (using the code above) checking if it was patched, if not returning a patched version...

We never tried using a decorator for this, I'm not sure its even possible to get the $injector service from a decorator, but if its possible it might be better designed (but who cares...)

This is a very simple hack to support this feature until it lands.