Observableへのサブスクリプションは決して引き起こされない

Question

Angular-CLI 1.0.0-beta.18（昨日更新）でプロジェクトを作成しました。私はコンポーネントからサービスの変更を検出しようとしています。

• 私は、サブスクリプションは、更新時にトリガー決してコンポーネント
• から、それに加入するサービス
• で観察可能なを作成します、私はthis answerからソリューションを実装しようとした/

this Plunkrおよびthis cookbook、ダイスなし。

ここ

import { Injectable } from '@angular/core'; 
import { ReplaySubject } from 'rxjs/ReplaySubject'; 
import { Article } from './article'; 

@Injectable() 
export class ArticleService { 

    // Placeholder for article's 
    articles: Article[] = [ 
     { _id: 1, title: "Article 1", text: "Text for article 1", created: new Date() }, 
     { _id: 2, title: "Article 2", text: "Text for article 2", created: new Date() } 
    ]; 

    // Observable openArticle source 
    private _openArticleSource = new ReplaySubject<Article>(1); 
    // Observable openArticle stream 
    openArticle$ = this._openArticleSource.asObservable(); 

    // Simulate GET /articles/:_id 
    getArticleById(_id: number): Article { 
     let article = this.articles 
      .filter(article => article._id === _id) 
      .pop(); 

     console.log("Pushing article to observable : ", article) // This gets logged, along with the article 
     this._openArticleSource.next(article); // Should trigger the subscription, but doesn't 

     return article; 
    } 
} 

は、リスニングコンポーネントです：ここで

は、サービスの後、私は別のコンポーネントからgetArticleById(1)呼び出して、私は、コンソールで"Pushing article to observable"を見ることができるので、

import { Component } from '@angular/core'; 
import { Subscription } from 'rxjs/Subscription'; 
import { ArticleService } from '../article.service'; 

@Component({ 
    selector: 'column-open-article', 
    templateUrl: './column-open-article.component.html', 
    providers: [ArticleService] 
}) 


export class ColumnOpenArticleComponent { 

    openArticle; 
    subscription: Subscription; 

    constructor(private articleService: ArticleService) { 
    this.subscription = articleService 
       .openArticle$ 
       .subscribe(article => { 
       console.log("Subscription triggered", article); // Never gets logged 
       this.openArticle = article; // Never gets updated 
       }) 
    } 


    ngOnDestroy() { 
    // prevent memory leak when component is destroyed 
    console.log("Unsubscribing") 
    this.subscription.unsubscribe(); 
    } 
} 

observableは更新されますが、サブスクリプションはトリガーされません。

サブスクリプションをサービス内に直接配置すると問題なく起動し、"Subscription triggered"がコンソールに表示されます。

しかし、コンポーネントに同じコードを配置しても機能しません。

アイデア？

Answer 1

ArticleServiceの複数のインスタンスがあるようです。

このようにすべてのコンポーネントインスタンスに新しいArticleServiceインスタンスが追加されるため、すべてのコンポーネントにArticleServiceを指定しないでください。

両方とも、親からの同じインスタンスを取得するように共通の親コンポーネントでそれを提供するが

又は

は@NgModule{ providers: [ArticleService]}でそれを提供注入、それはアプリケーション・ルート・スコープでandeveryコンポーネントが提供され、 ArticleServiceを注入するサービスでは、同じインスタンスが注入されます。