Why to use $onInit in AngularJS? [duplicate]

Question

In AngularJS, what is the purpose of the $onInit function if I can do the same initialization without that function?

For example this:

module.component("myComponent", {
        ...
        controller: function() {
            const $ctrl = this;

            $ctrl.$onInit = () => {
                $ctrl.var1 = "hello";
                $ctrl.var2 = { test: 3 };
            }
        }
    });

Can also be done like this:

module.component("myComponent", {
        ...
        controller: function() {
            const $ctrl = this;

            $ctrl.var1 = "hello";
            $ctrl.var2 = { test: 3 };
        }
    });

Is there some case where $onInit is necessary?

Answer 1

Per the AngularJS docs

Called on each controller after all the controllers on an element have been constructed and had their bindings initialized (and before the pre & post linking functions for the directives on this element).

This gives you two guarantees:

1. All controllers on this element have been constructed
2. The pre & post linking functions for this element have not been executed

In contrast to your first method, where neither of these facts are guaranteed (though the second one is highly probable).

In addition, as a matter of style and readability, it makes it very clear to a potential reader/reviewer that this is code that you as the developer intended to run upon initialization of this controller.