Angular2 - 'watch' provider özelliği çoklu bileşenlerde

Question

Ben NG1 ortamı formu geliyorum ve şu anda mevcut tüm özellikleri ile NG2 uygulaması oluşturuyorum. Ben acele mimarisi ile çok hızlı hareket etti ve çoğu cevaplar güncel değil beri ben sormadan önce google ve stackoverflow soruları ama şanssız hiçbir şey yoktu.

Davam: Ben mülkiyet kullanıcı ile Auth sağlayıcı (servis) var, kullanıcıyı gözlemlemek ister ve ben çalıştığım şey birden çok bileşenden (gezinme çubuğu, kenar çubuğu vb)

tepki vereceğini:

@Injectable(); 
export class Auth { 

    private user; 
    authorized: EventEmitter<boolean>; 

    constructor(public router:Router){ 
     this.authorized = new EventEmitter<boolean>(); 
    } 

    login(user, token):void{ 
     localStorage.setItem('jwt', token); 
     this.user = _.assign(user); 

     this.authorized.emit(<boolean>true); 
     this.router.parent.navigateByUrl('/'); 
    } 
} 


/***************/ 
@Component({...}) 
export class NavComponent { 

    public isAuthroized: boolean = false; 

    constructor(Auth:Auth){ 
     Auth.authorized 
      .subscribe((data) => this.onUserChanged(data)); 
    } 

    onUserChanged(user){ 
     alert('USER:' + user.email); 
     this.isAuthroized = true; 
    } 
} 

/****************/ 
bootstrap(AppComponent, [ 
    ROUTER_PROVIDERS, 
    ELEMENT_PROBE_PROVIDERS, 
    HTTP_PROVIDERS, 
    MapLoader, 
    Auth 
]) 

Ancak şanssız. Gözlemlenebilir EventEmitter'ı kullanmalı mıyım yoksa bu davayı ele almak için başka doğru yaklaşım var mı? NG1'de, servisin mülkünde $ watch olmak kadar basit olurdu. Teşekkürler!

DÜZENLEME

:

... 
userUpdated: EventEmitter<boolean>; 

constructor(public router:Router){ 
    this.userUpdated = new EventEmitter<any>(); 
} 

... 

logout(returnUrl?: string): void{ 
    delete this.user; 
    localStorage.removeItem('jwt'); 
    this.userUpdated.emit(undefined); 

    if(!_.isEmpty(returnUrl)){ 
     this.router.parent.navigateByUrl(returnUrl); 
    } 

} 

Ve şimdi olay denir, neden oturum kapatma değil giriş için çalışan şudur: Ben hizmetini Auth için yeni bir yöntem ekledi?

DÜZENLEME 2:

export class LoginPageComponent { 
    error: string; 

    constructor(public http: Http, public router: Router, public Auth:Auth){ 
    } 

    login(event, email, password){ 
     ... 
     this.http.post('/api/login', loginModel, {headers: headers}) 
     .map((res) => res.json()) 
     .subscribe((res: any) => { 
      this.Auth.login(res.user, res.ADM_TOKEN); 
     }, (error) => this.error = error._body); 
    } 

} 

i .. sağlayıcıları dizisinin [Auth] içinde NavComponent bırakılan bu yüzden küresel Auth farklı nesne .. üzgünüm çocuklar oldu ..

Aptal hata ÇÖZÜLDÜ! Umarım bu konu Angular2'de yeni birine yardımcı olur. Emeğin için teşekkürler.

Answer 1

Her bileşene sağlayıcı olarak Auth eklediğinizi varsayalım. Bu, her bileşen için sınıfın yeni bir örneğini oluşturur. Yalnızca bootstrap(AppComponent, providers: [...]) veya yalnızca AppComponent numaralı telefondan ekleyin.

Answer 2

Artık Bölgeler tarafından yönetildiğinden beri Angular'de saat özelliği olmadığını fark edebilirsiniz.

Diğer bileşenleri bildirmek için, userUpdated olayına ilişkin Auth hizmetinize EventEmitter numaranızı ekleyebilirsiniz. Bildirilmek isteyen bileşenler bu yayıcıya kaydedilebilir.

login(user, token):void{ 
    localStorage.setItem('jwt', token); 
    this.user = _.assign(user); 

    this.authorized.emit(this.user); 
    this.router.parent.navigateByUrl('/'); 
    } 
} 

Eğer size yardımcı Umut, Thierry