Angular 4 Component to Component Communication

Asked Aug 15 '17 at 09:19

Active Aug 15 '17 at 09:22

Viewed 166 times

I'm sending an API call on app.component.ts and emitting the change, so i can get the emitted value in the in the child components. Everything is working fine until a router redirect comes. After the router redirects the data is not rendering since it is not emitted. I believe this is because there is no change detected. when i refresh the page data is available. Is there any workaround to get the data.

app.component.ts

  ngOnInit() {
      this._ApiConnectorService.getQuestions().subscribe(res => {
      this._EmittersService.sendQuestion(res) })
  }
 }

summary.component.ts

ngOnInit() {
   this._EmittersService.qustionEmitted$.subscribe(obj => {
     this.questionSummary = obj;
  }
}

Emitter Function

private emitQuestion = new Subject<any>();
qustionEmitted$ = this.emitQuestion.asObservable();
sendQuestion(change: any) {
  this.emitQuestion.next(change);
}

I'm calling the summary component via button click.

<button *ngIf="allAnswered" class="btn btn-view-summary" routerLink="/summary">  
  View Summary
</button>

Please guide me on this

Thanks in advance

edited Aug 15 '17 at 09:22

asked Aug 15 '17 at 09:19

sinthu225

what is inside your `_EmittersService.sendQuestion` method ? – FAISAL Aug 15 '17 at 09:22
Why don't you subscribe to ApiConnector inside EmitterService itself? – Egor Stambakio Aug 15 '17 at 09:22
@Faisal added the emitter function in the question – sinthu225 Aug 15 '17 at 09:23
@wostex: I wanted to get the question only when the app loads, not sure though whether that's the correct approach – sinthu225 Aug 15 '17 at 09:28
Can you describe more on how the router redirect behave on your app? – trungk18 Aug 15 '17 at 15:09

Angular 4 Component to Component Communication

0 Answers0