/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
Ngmodel component angular
Javascript AngularJS
0 vote227 views1 answer
Angular chart
Javascript AngularJS
9 votes170 views1 answer
Angular ERROR Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked.
Javascript AngularJS
1 vote164 views1 answer
Bs modal service angular pass data
Javascript AngularJS
2 votes177 views6 answers
Tailwind in angular
Javascript AngularJS
0 vote239 views1 answer
Como saber cuando un link cambia angular
Javascript AngularJS
0 vote207 views1 answer
Import map in angular
Javascript AngularJS
24 votes184 views2 answers
Date format in angular ts
Javascript AngularJS
0 vote178 views1 answer
USA phone number validator angular
Javascript AngularJS
0 vote165 views1 answer
Angular checkbox disabled
Javascript AngularJS