2016-11-10 3 views
-2

In angular2 möchte ich meine Komponente mit einer anderen Komponente sprechen, wie ist das möglich?In angular2 möchte ich meine Komponente mit einer anderen Komponente sprechen, wie ist das möglich?

Ich habe im Grunde eine Komponente, die eine Broadcast zu einer anderen Komponente durchführen muss, damit diese Komponente sich selbst aktualisieren kann.

Ich weiß nur, wie dies in eckigen v1 zu tun.

Ich habe keinen Code zu zeigen, da ich keine Ahnung habe, wie das geht.

Die Komponenten sind getrennt und nicht verschachtelt. Wie kann ich sie miteinander reden lassen, z.B. ein Ereignis oder etwas?

+1

Sie können die Dokumentation lesen wollen: https://angular.io/docs/ts/latest/cookbook/component-communication.html – silentsod

+0

Haben Sie einen Link für Eltern zu Eltern? Ich brauche Eltern nicht zum Kind – AngularM

+0

Das gleiche Konzept wie Eltern - Kind. Kommunikation zwischen Komponenten, denke immer "Service" – PierreDuc

Antwort

0

Ich habe einen Login-Dienst, der eine loggedin beobachtbar definiert:

private loggedIn$: Subject<LoggedIn>; 

constructor() { 
    this.loggedIn$ = <Subject<LoggedIn>>new Subject(); 
} 

I definiert dann zwei Methoden gesetzt und erhalten:

setLoggedIn(loggedIn: LoggedIn): void { 
    this.loggedIn$.next(loggedIn); 
} 

getLoggedIn(): Observable<LoggedIn> { 
    return this.loggedIn$.asObservable(); 
} 

Die in der Klasse angemeldet:

export interface ILoggedIn { 
    email: string; 
    password: string; 
    error: string; 
} 

export class LoggedIn implements ILoggedIn { 
    email: string; 
    password: string; 
    error: string 

    constructor(email: string, password: string, error: string) { 
    this.email = email; 
    this.password = password; 
    this.error = error; 
    } 
} 

Damit können Sie benachrichtigt werden, dass sich der Benutzer an einer beliebigen Stelle in Ihrer App angemeldet hat, indem Sie einfach das beobachtbare Objekt abonnieren:

constructor(
    private ls: LoginService, 
    private ss: SettingsService) { 
}  

ngOnInit() { 
    this.ls.getLoggedIn() 
    .subscribe(
     loggedIn => { 
     this.items = this.as.getLoggedInMenu(); 

     var us = this.ss.getUserSettings(); 
      this.ts.setTheme(us.theme); 
    }); 
} 
Verwandte Themen