/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

1 vote326 views2 answers
Get input value angular
Javascript AngularJS
0 vote342 views1 answer
Generate angular.json for existing project
Javascript AngularJS
0 vote325 views1 answer
Angular countdown begin stop pause
Javascript AngularJS
0 vote361 views2 answers
Angularjs - controllerAs
Javascript AngularJS
3 votes342 views3 answers
AngularJs drag and drop
Javascript AngularJS
0 vote332 views1 answer
How to set direction based on language in angular
Javascript AngularJS
0 vote345 views1 answer
Styles in angular component
Javascript AngularJS
0 vote313 views1 answer
Angular.json to war
Javascript AngularJS
1 vote322 views4 answers
Angular 12 features
Javascript AngularJS
29 votes413 views2 answers
ERESOLVE unable to resolve dependency tree npm ERR npm ERR! Found: @angular/[email protected] npm ERR! node_modules/@angular/core
Javascript AngularJS