2016-07-22 30 views
0

私はObservableChangeDetectionStrategyを使用して、他のコンポーネントに変更のお知らせを伝えようとしています。残念ながら、ObservableオブジェクトaddItemStreamは未定義です。ここで何が間違っていますか?角2.観測可能が定義されていません

import { Component, ChangeDetectionStrategy, ChangeDetectorRef, Input }   from '@angular/core' 
import { ROUTER_DIRECTIVES, Router } from '@angular/router'; 
import {Observable} from 'rxjs/Observable'; 

@Component({ 
    selector: 'bp-header', 
    templateUrl: 'app/header.component.html', 
    directives: [ROUTER_DIRECTIVES], 
    changeDetection: ChangeDetectionStrategy.OnPush 
}) 
export class HeaderComponent { 
    @Input() addItemStream: Observable<any>; 
    public isActive: number; 
    public language: string = "en"; 
    constructor(private cd: ChangeDetectorRef) {} 
    ngOnInit() { 
     this.isActive = 1; 
    } 
    ngAfterViewInit() { 
    this.addItemStream.subscribe(() => { 
     this.setLanguage; // application state changed 
     this.cd.markForCheck(); 
     }) 
    } 
    public setLanguage = (language: string) => { 
     if (this.language === language) { return } 
     else { this.language = language }; 
    } 
    public setActive(active: number) { 
     if (this.isActive === active) return; 
     this.isActive = active; 
    } 
} 

答えて

2

ObservablengOnInitに登録しています。 InputObservable(および他のすべてのInputs)は、その時点でundefinedになるためです。

ngAfterViewInitに登録してみてください。 また、サービスを利用することもできます。それはあなたの人生を(そして、Observableを共有するのが)ずっと簡単になります。

+0

あなたはこの意味でください::ngAfterViewInit(){ this.addItemStream.subscribe(()=> { this.setLanguageをコンポーネントが最初に初期化するときしかし、流れはそうちょうどあなたのコンストラクタでそれを初期化定義されていません; this.cd.markForCheck(); } } –

+0

上記のコードを更新しましたが、同じエラーがあります。 –

+0

それは動作するはずですが、Observableをいつ、どこで作成するかによって異なります。より多くのコンテキストコードがなければ、問題が何であるかを言うことは困難です。いずれにしても、Observableをサービスに入れることをお勧めします。それはより良い解決策です。 – hholtij

0

どこに登録しても問題ありません。私は通常コンストラクタでそれを行います。

constructor(private cd: ChangeDetectorRef) { 
    this.addItemStream = new Observable<any>(); 
} 
+0

ObservableがInputとしてコンポーネントに渡された場合、それは間違いなく重要です。まだ未定義のときに購読しようとすると、単に動作しません。 – hholtij

関連する問題