2016-03-11 25 views
16

Sürüm beta.8 ile bir Angular 2 uygulaması yapıyorum.
Bu uygulamada OnInit'i uygulayan bir bileşenim var.
Bu bileşende ngOnInit işlevi var, ancak ngOnInit işlevi hiçbir zaman çağrılmıyor. Yönlendirme appAngular 2 ngOnInit

import { Component, OnInit } from 'angular2/core'; 

@Component({ 
    templateUrl: '/app/html/overview.html' 
}) 

export class OverviewComponent implements OnInit { 
    ngOnInit() { 
    console.log('ngOnInit'); 
    } 
} 

:

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

kullanıcı zaten LoginComponent ve RegisterComponent içine kaydedilir olmadığını görmek için bir onay yoktur.
Kullanıcı oturum açtıysa, bileşenler Genel Bakış'a şu şekilde yönlendirilir: router.navigate(['Overview']).
Genel Bakış yolunu varsayılan olarak kullanırsam konsola ngOnInit'i görüyorum.
Dolayısıyla, sayfamı yeniden yönlendirme problemi gibi görünüyor.
Genel Bakış sayfasına yönlendirme ve ngOnInit işlevini nasıl çağırırsınız?

Hem RegisterComponent ve LoginComponent kullanımı

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

Tarayıcı i tarayıcı özel kodu saklamak olduğu bir sınıftır. Bu gotoMain fonksiyonudur:

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

this._browser.main bu durumda 'Genel Bakış', sadece bir dizedir.

+0

angular2/core den

enjekte NgZone (ithalat Eğer 'emin yaptınız mı OverviewComponent' Eğer 'OnInit' ithalat ve uygular yoksa bile, Evetse? Işleri' OnInit', 'ngOnInit' çalışacaktır. – micronyks

+0

@micronyks Genel Bakış Bileşenine bir 'message: string = 'test' 'ekledim ve' {{message}} 'ile görüntülemeye çalıştım ve çalıştı. – VincentKen

+0

Oh! Bu durumda kodunuzu görmem gerekiyor . Tamam. Sadece ben önerdi ne kaldırmayı deneyin ve eğer işler! Günter @ – micronyks

cevap

34

Ben bir bölge sorunu sanırım.

constructor(private zone:NgZone) {} 

this._browser.getStorageValue('api_key', api_key => { 
    if (api_key) { 
    this.zone.run(() => this._browser.gotoMain()); 
    } 
}) 
+0

Teşekkür ederim @ Günter çalışıyor. NgZone bu işi yapmak için ne yapar? – VincentKen

+7

Köşeli, kodunu “addEventListener()”, “setTimeout()” ve diğer async API'lerinin, değişiklik algılamayı yeniden başlatmak için zaman uyumsuzluğu oluştuğunda Angular'e bildirmek üzere yaması için yamalı bir alanda çalışır. Bu, değişiklik tespitini oldukça verimli hale getirir. Kod, Angulars bölgesini bir şekilde çevreleyen kod çağrıldığında Angulars değişimi algılamasını başlatmaz. Angulars bölgesi dışında çağrılan koddan bir yöntem (bir Açısal bileşenden veya benzerinden bile olsa) çağrılırsa, her şey bölge dışına doğru çalışır. olay tamamen işlendi. Zone.run (...) ile, yürütmeyi Angulars bölgesine geri zorlarsınız. –

+0

'addEventListener()' için bunu aşmak için 'BrowserDomAdapter' kullanabilirsiniz ve bunu sizin için yapar. – Philip