Angular 2 Passing Werte über Komponenten

Question

Ich habe app.component.ts die Eltern und zwei Routen anmelden und

In meinem Register Ansicht registrieren, nach der Anmeldung bestätigt wird, möchte ich für die automatische Anmeldung Login Ansicht zu übergeben.

register.component.ts

onSubmit() { 
let params = { 
     mobile:this.registrationForm.value.mobile, 
     password:this.registrationForm.value.password 
    } 
    this.sharedService.emitChange({origin:"login", credentials:params }); 
    } 

login.component.ts (My subscribe nicht funktioniert)

constructor(private fb: FormBuilder, private sharedService: SharedService) { 
    sharedService.changeEmitted$.subscribe(// not working 
     text => { 
     console.log(text); 
     if (text.origin == 'login') this.login(text.credentials); 
     }); 
    } 

app.component.ts (Dies funktioniert)

sharedService.changeEmitted$.subscribe(
     text => { 
      if (text.origin == 'login'){}; 
     }); 

Ich hoffe, ich war klar. Ich habe zwei Ansichten, login und registrieren und wie zwischen diesen beiden ts-Dateien zu kommunizieren. Mache ich das richtig?

Answer 1

Ich denke, das Problem ist, dass die SharedService die Änderungen ausgibt, bevor die LoginComponent erstellt wird. Deshalb funktioniert es innerhalb der AppComponent, aber nicht in der LoginCOmponent.
Eine mögliche Lösung ist ReplaySubject zu verwenden.
Mit der ReplaySubject können Sie eine Chche-Anzahl definieren n. Es wird dann die letzte n speichert und neue Subscription s über alle von ihnen benachrichtigen.
Also in Ihrem Fall sollten Sie eine new ReplaySubject<>(1) verwenden.
Jeder, der diese ReplaySubject abonniert, erhält jetzt den letzten ausgegebenen Wert.

Answer 2

Ich kann nicht kommentieren Ich werde dies als Antwort schreiben.

Sie geben Ihren Text vor der Erstellung von LoginComponent aus. Die LoginComponent sollte dort das Ereignis abhören, bevor der Text ausgegeben wird.

Eine Lösung hierfür ist localStorage zu verwenden:

register.component.ts:

params = { 
    mobile:'mobile', 
    password:'password' 
} 
onSubmit(): void { 
    console.log("putting in localStorage") 
    localStorage.setItem('params', JSON.stringify(this.params)) 
} 

login.component.ts:

params:any 
ngOnInit(): void { 
    console.log("getting from localStorage") 
    this.params = JSON.parse(localStorage.getItem('params')) 
    console.log(this.params) 
} 

hoffen, dass diese hilft!