/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 vote222 views1 answer
How to add toaster in angular 9
Javascript AngularJS
0 vote211 views1 answer
Angular injector.create example
Javascript AngularJS
7 votes201 views4 answers
Build angular project
Javascript AngularJS
2 votes192 views1 answer
How to set disabled flag formgroup angular
Javascript AngularJS
0 vote208 views1 answer
Inject firebase in angularjs
Javascript AngularJS
0 vote211 views4 answers
Get form control value in angular 8
Javascript AngularJS
0 vote205 views1 answer
Angular 11 how to use skipLocationChange
Javascript AngularJS
1 vote208 views1 answer
Angular cli path environment variable
Javascript AngularJS
6 votes173 views2 answers
Auto scroll to bottom of div angular
Javascript AngularJS
1 vote292 views3 answers
Error referenceerror $ is not defined in angular 10
Javascript AngularJS