/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

0 vote107 views1 answer
Angular 9 dockerfile
Javascript AngularJS
0 vote118 views2 answers
How to create a new angular project in visual studio code
Javascript AngularJS
1 vote110 views1 answer
Dynamic component angular parameters
Javascript AngularJS
0 vote321 views1 answer
Resolvers in angular
Javascript AngularJS
0 vote122 views1 answer
Angular view not changing on model
Javascript AngularJS
0 vote110 views1 answer
Scrollout js angular
Javascript AngularJS
0 vote117 views1 answer
Convert file to blob in angular
Javascript AngularJS
0 vote115 views1 answer
Use your custom component inside Angular Material Dialog
Javascript AngularJS
-2 votes143 views2 answers
Bootstrap 4 navbar-collapse not working angular
Javascript AngularJS
0 vote121 views2 answers
Angular raw
Javascript AngularJS