/Javascript/AngularJS/VideoTitle$ Angular 2 - communication between two sibling components

VideoTitle$ Angular 2 - communication between two sibling components

Because you are working with Observers and Observables in your service, 
you don't need to communicate both components because you can directly
 connect the service with the component template. This should be the code:

Service:

import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import { Subject }    from 'rxjs/Subject';
import 'rxjs/add/operator/map';

@Injectable()
export class AppService {
  private apiURL = "https://www.googleapis.com/youtube/v3/playlistItems?part=snippet,contentDetails,status&maxResults=10&playlistId=PLSi28iDfECJPJYFA4wjlF5KUucFvc0qbQ&key=AIzaSyCuv_16onZRx3qHDStC-FUp__A6si-fStw&pretty=true";

  //Observable string sources
  private thisVideoTitle = new Subject<string>();
  //Observable string streams
  videoTitle$ = this.thisVideoTitle.asObservable();
  constructor(private http:Http) { }

  getData() {
    return this.http.get(this.apiURL)
      .map((res:Response)=> res.json())
      .subscribe(nameTitle => this.thisVideoTitle.next(nameTitle))
  }
}

part ii
Then if you want to use this into your component template it should be something like:
<li *ngFor="let title of videoTitle$ | async"></li>

Source: stackoverflow.com

Similar codes

32 votes329 views4 answers
Angular version command
Javascript AngularJS
0 vote184 views1 answer
How to manually trigger browser back button from angular
Javascript AngularJS
0 vote180 views2 answers
Utiliser les données passees a un modal dans son propre composant en angular
Javascript AngularJS
2 votes190 views1 answer
Use promise in angular 8
Javascript AngularJS
1 vote174 views2 answers
Angular disable select dropdown
Javascript AngularJS
12 votes211 views3 answers
Angular create guard
Javascript AngularJS
2 votes181 views3 answers
This version of CLI is only compatible with Angular versions 0.0.0 || ^10.0.0-beta || >=10.0.0 <11.0.0, but Angular version 9.1.3 was found instead.
Javascript AngularJS
0 vote152 views1 answer
Angular UI datepicker is getting wrong date
Javascript AngularJS
0 vote170 views1 answer
Is it possible to filter with multiple condition in angularjs?
Javascript AngularJS
0 vote162 views1 answer
Unhandled Navigation Error: angular dist build
Javascript AngularJS