0

angular2の異なるコンポーネントの間で値を渡すために、私は異なるコンポーネントを異なるコンポーネントに注入します。observableはangular2の次の値を受け取らない

私のPagesServiceコンポーネントでは、動作の件名を定義して値を渡します。 enter image description here

私はプレイリストを更新した後、あなたは私が実際のプレイリストを見ることができます:私はこれは、コンソール出力である

import { Component, OnInit, Input, Output, OnChanges, EventEmitter, Injectable } from '@angular/core'; 
    import { Http, Response } from '@angular/http'; 
    import { Observable } from 'rxjs/Observable'; 
    import { PagesService } from './shared/pages.service'; 
    import { Subject,BehaviorSubject } from 'rxjs/Rx'; 
@Component({ 
    selector: 'pages', 
    styleUrls: ['app/pages/pages.css'], 
    templateUrl: 'app/pages/pages.html', 
    providers: [PagesService] 
}) 
      export class PagesComponent { 

       playlists: Playlists; 

       constructor(private service: PagesService, private playlistService: PlaylistService) { 
       this.playlists = new Playlists(); 
       this.service.getCurrentPlaylists().subscribe((playlists) => { 
        console.log(playlists, 'new playlists coming'); 
        this.playlists = playlists; 
       }, error => { 
        console.log(error); 
       }); 
       } 
     } 

PagesComponent

と呼ばれるコンポーネントにプレイリストを渡す必要が

import { Injectable } from '@angular/core'; 
import { ApiService } from '../../apiService/api.service'; 
import { Playlists } from '../shared/playlists.model'; 
import { Subject, BehaviorSubject } from 'rxjs/Rx'; 


@Injectable() 
export class PagesService { 

    private currentPlaylists: Subject<Playlists> = new BehaviorSubject<Playlists>(new Playlists()); 

    constructor(private service: ApiService) { 

    } 

    getCurrentPlaylists() { 
    return this.currentPlaylists.asObservable(); 
    } 

    setCurrentPlaylists(playlists: Playlists) { 
    console.log(playlists, 'i am here'); 
    this.currentPlaylists.next(playlists); 
    } 
} 

私はページにコンポーネントを受け取ることはできませんが、私はそれをコンソールに出力したいです。

アイデア?

おかげ

+0

違いがあるのか​​どうかわかりませんが、以前は 'asObservable()'メソッドを使ったことがありませんでした。代わりに、あなたは 'getCurrentPlaylists()を行うことができます:Observable {return this.currentPlaylists; } '。 'Subject'は' Observable'を拡張しているので、あなたはそのようにキャストできます。さもなければ、あなたのコードは私が何度もやったように見えます。 – batesiiic

答えて

1

どのコンポーネントがsetCurrentPlaylists()を呼んでいますか?

ほとんどの場合、PagesComponent以外のコンポーネントがこのメソッドを呼び出しており、他のコンポーネントのメタデータにproviders: [PagesService]が定義されている可能性があります。これにより、PagesServiceの2つのインスタンスがPagesComponentが提供する(および注入する)–と、他のいくつかのコンポーネントが提供する(および注入する)インスタンスが作成されます。

関連する問題