Как реализовать rxjs подписку в угловом 2?

Question

У меня есть сервис с помощью следующего кода:

import {Injectable} from 'angular2/core'; 
import {Observable} from 'rxjs/Observable'; 
import {Observer} from 'rxjs/Observer'; 
import 'rxjs/add/operator/share'; 
import {Article} from './article'; 

@Injectable() 
export class ArticleService { 
public articleSelected$: Observable<Article>; 
private _observer: Observer<Article>; 

constructor() { 
this.articleSelected$ = new Observable(observer => 
    this._observer = observer).share(); 
} 
selectArticle(article:Article){ 
this._observer.next(article); 
}} 

и в моем компоненте:

export class seeArticle{ 

subscription: any; 

constructor(private _articleService: ArticleService) { 
} 
ngOnInit() { 
    this.subscription = this._articleService.articleSelected$ 
     .subscribe(article => this.onArticleSelected(article)); 
} 
onArticleSelected(article){ 
    console.log("an article was selected",article); 
} 
} 

Когда я выбираю статью (нажав на него) в другом компоненте, функция selectArticle служба запускается на выполнение , проблем нет. Однако this._observer.next(article); кажется, чтобы вызвать следующую ошибку:

"TypeError: Cannot read property 'next' of undefined" 

Будучи очень новый угловой 2 и Rxjs, я не могу понять его

Answer 1

Проблема с кодом, что this._observer еще не доступен, когда selectArticle метод, потому что

observer => this._observer = observer 

часть асинхронная.

Таким образом, вместо создания Наблюдаемые вручную, используйте EventEmitter что оборачивает Наблюдаемые правильно для вас:

@Injectable() 
export class ArticleService { 
    public articleSelected$: EventEmitter<Article>; 

    constructor() { 
    this.articleSelected$ = new EventEmitter(); 
    } 

    selectArticle(article:Article){ 
    this.articleSelected$.next(article); 
    } 

} 

Демо:http://plnkr.co/edit/sz5Dzm1SoisTJlvj8RcQ?p=info