/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 vote179 views1 answer
Angular autocomplete displaywith
Javascript AngularJS
1 vote161 views1 answer
Angular run validation on other controls
Javascript AngularJS
0 vote175 views1 answer
Angularjs select placeholder
Javascript AngularJS
3 votes159 views3 answers
Angular email validation
Javascript AngularJS
0 vote177 views1 answer
Input type shows object angularjs
Javascript AngularJS
0 vote171 views1 answer
Const link = document.createElement('a'); angular10
Javascript AngularJS
0 vote150 views1 answer
Angular array export to excel
Javascript AngularJS
2 votes181 views2 answers
Get month angular with 0
Javascript AngularJS
0 vote159 views1 answer
Angular cli spec test false
Javascript AngularJS
0 vote177 views2 answers
Check if item is already registered in angular angularfire site:stackoverflow.com
Javascript AngularJS