saif
saif

Reputation: 487

ngOnInit vs ionViewDidLoad in ionic 2 or ionic 2+

Which one will I use for initializing data and why?

ngOnInit() {
    this.type = 'category';
    this.getData();
    this.setData();
}

ionViewDidLoad() {
    this.type = 'category';
    this.getData();
    this.setData();
}

Upvotes: 30

Views: 32390

Answers (3)

orouwk
orouwk

Reputation: 355

ionViewDidLoad firing is close related to the NavController.

If you need a hook for a component that is rendered independent of the NavController (not all components in an ionic 2 app are pages) you should use angular lifecycle hooks instead of ionic navcontroller hooks.

Now, which one is suitable for you, it depends on the implementation case.

Anyway the names of all those hooks are self-explanatory most of the times.

Upvotes: 4

naomi
naomi

Reputation: 2643

ngOnInit is a life cycle hook called by Angular2 to indicate that Angular is done creating the component.

ionViewDidLoad is related to the Ionic's NavController lifeCycle events. It runs when the page has loaded. This event only happens once per page being created.

Basically both are good places for initializing the component's data.

But for using ngOnInit you need to implement the Angular's OnInit class, In the other hand ionViewDidLoad could be only defined for components that are pushed/popped from a NavController.

So I would say use the ionViewDidLoad for components in the NavController stack and ngOnInit for other components.

Upvotes: 69

Marcus Höglund
Marcus Höglund

Reputation: 16856

Both function works the same way, they get called when the view is initially loaded into the DOM.

Great blog about ionic2s lifecycle hooks here.

Upvotes: 2

Related Questions