2016-12-20 5 views
2

私は角を見ることができます。実際に私の問題をクリックしたときに私のsubscribe機能が呼び出されなかったのですか?私たちはここに2号機でsubscribe関数が呼び出されないのはなぜですか?

https://plnkr.co/edit/83NaHoVaxiXAeUFoaEmb?p=preview

constructor() { 
    this.data = new Observable(observer => this.dataObserver = observer); 
    this.data.subscribe(value => { 
    console.log('+++') 
    console.log(value) 
    }) 
} 

hndle(){ 
    this.name.push({name:"navee"}); 

    this.dataObserver.next(this.name); 
} 

next関数を呼び出すときのドキュメントsubscribeあたりの関数として が呼び出されます、私はあなたのコードを変更したボロディミールBilyachatの提案に基づいて文書

http://reactivex.io/rxjs/manual/tutorial.html

+0

hndleはいつ呼びますか? –

答えて

1

です。その作業は今plzチェック。問題は、それがこのソリューションを使用することをお勧めしますあなたのケースではdataObserver

 //our root app component 
import {Component, NgModule} from '@angular/core' 
import {BrowserModule} from '@angular/platform-browser' 
import 'rxjs/Rx'; 
import {Observable} from 'rxjs/Observable'; 

@Component({ 
    selector: 'my-app', 
    template: ` 
    <div> 
     <ul> 
     <li *ngFor ="let n of name">{{n.name}}</li> 
     </ul> 
     <button (click)="hndle()">heelo</button> 
    </div> 
    `, 
}) 
export class App { 
    private data:Observable; 
    private dataObserver:Observer; 
    name:string; 
    name[]; 
    constructor() { 
     this.dataObserver = new Observable(observer => this.dataObserver = observer); 
this.dataObserver.subscribe(value => { 
    console.log('+++') 
    console.log(value) 
    }); 
    } 

    hndle(){ 

    this.name.push({name:"navee"}); 

    this.dataObserver.next(this.name); 
    } 
} 

@NgModule({ 
    imports: [ BrowserModule ], 
    declarations: [ App ], 
    bootstrap: [ App ] 
}) 
export class AppModule {} 

リンクhttps://plnkr.co/edit/PO80y2udrOhsVq4QQXc5?p=preview

+0

this.dataObserver = observer - この部分は正しく設定する必要があります。 –

+0

@VolodymyrBilyachatこれを伝えてくれてありがとうございます。私はちょうど助けようとしていた:私は自分の答えを変更しました –

+0

@amitあなたが行った変更は – user944513

0

を使用してのあなたの方法にあった:

constructor() { 
    this.data = new Subject(); 

    this.data.subscribe(value => { 
     console.log('+++'); 
     console.log(value); 
    }); 
} 

hndle() { // TYPO: Probably it was meant to be handle 
    this.name.push({ 
     name: 'navee' 
    }); 

    this.data.next(this.name); 
} 

は、追加することを忘れないでください:

import { Subject } from 'rxjs/Subject' 

実例:

https://plnkr.co/edit/zB8FHTVEm2QUHiEAYuQB?p=preview

0

私はあなたが観察可能な2回購読していると信じています。 .share()を追加することで修正できるはずです

constructor() { 

    this.data = new Observable(observer => this.dataObserver = observer).share(); 
    this.data.subscribe(value => { 
    console.log('+++') 
    console.log(value) 

    }) 
    } 

    hndle(){ 
    this.name.push({name:"navee"}); 

    this.dataObserver.next(this.name); 
    } 
関連する問題