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 RegisterComponent
and 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'.
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());
}
})