/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

3 votes193 views1 answer
Ngchange angular 8
Javascript AngularJS
0 vote178 views1 answer
How to convert date format using date pipe in angular
Javascript AngularJS
0 vote205 views1 answer
Get image from s3 bucket angular
Javascript AngularJS
5 votes204 views2 answers
Generate component with module angular 8
Javascript AngularJS
0 vote195 views1 answer
Localhost:3000 ad is not working with outlook angular 8
Javascript AngularJS
0 vote194 views3 answers
Get local storage data in angular
Javascript AngularJS
0 vote197 views1 answer
Angular empty object
Javascript AngularJS
5 votes190 views1 answer
Access angular app outside localhost
Javascript AngularJS
2 votes147 views2 answers
Placeholder in angular 9 select with working required
Javascript AngularJS
24 votes193 views1 answer
Angular date formats
Javascript AngularJS