Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular 2 ngOnInit not called

I am building an Angular 2 app with version beta.8.
In this app i have a component which implements OnInit.
In this component i have the function ngOnInit, but the ngOnInit function is never called.

import { Component, OnInit } from 'angular2/core';  @Component({   templateUrl: '/app/html/overview.html' })  export class OverviewComponent implements OnInit {   ngOnInit() {     console.log('ngOnInit');   } } 

The Routing of the app:

@RouteConfig([   {     path: '/overview',     name: 'Overview',     component: OverviewComponent   },   {     path: '/login',     name: 'Login',     component: LoginComponent   },   {     path: '/register',     name: 'Register',     component: RegisterComponent,     useAsDefault: true   } ]) 

There is a check to see if the user is already logged in inside the LoginComponent and RegisterComponent.
If the user is logged in, the components redirect to Overview using: router.navigate(['Overview']).
If i use the Overview route as default i do see ngOnInit inside the console.
So the way i redirect my page seems to be the problem.
How can redirect to the Overview page and call the ngOnInit function?

Both the RegisterComponentand the LoginComponent use

ngOnInit() {   this._browser.getStorageValue('api_key', api_key => {     if (api_key) {       this._browser.gotoMain();     }   }) } 

Browser is a class in which i store browser specific code. This is the gotoMain function:

gotoMain() {   this._router.navigate([this._browser.main]); } 

this._browser.main is just a string in this case 'Overview'.

like image 420
Vincent Kenbeek Avatar asked Mar 11 '16 09:03

Vincent Kenbeek


1 Answers

I guess it's a zone issue.

Inject NgZone (import from angular2/core

constructor(private zone:NgZone) {}  this._browser.getStorageValue('api_key', api_key => {   if (api_key) {     this.zone.run(() => this._browser.gotoMain());   } }) 
like image 136
Günter Zöchbauer Avatar answered Sep 22 '22 22:09

Günter Zöchbauer