Angular2 - * ngIf和異步observables

Question

我有使用* ngIf與可觀察變量的問題。問題是，當我躲在元素與* ngIf，並再次顯示，值將不會加載這樣：當showDiv放在第一位設置爲真正

 <div *ngIf="showDiv"> 
      {{ someObservable$ | async }} 
     </div> 

基本上，someObservable負荷，但是當我將其設置爲false，然後再次到true，則值不會加載。怎麼了？

問候

Answer 1

UPDATE：

感謝j2L4e，他暗示！

BehaviorSubject是關鍵！

看到這個plunker：

https://plnkr.co/edit/whkrQk3tHCJCvvi6rlaE?p=info

import {Component, NgModule} from '@angular/core' 
import {BrowserModule} from '@angular/platform-browser' 

import { Subject, BehaviorSubject } 'rxjs/Rx'; 
//import { Observable, Subject } from 'rxjs'; 

@Component({ 
    selector: 'my-app', 
    template: ` 
    <div> 
     <h2 (click)="showMe = !showMe">Hello {{name}}</h2> 
     <br /> 

     <div *ngIf="showMe"> 
     sbj1: {{ _subj1 | async }} 
     </div> 

     <div *ngIf="showMe"> 
     obs1: {{ _obs1 | async }} 
     </div> 

     <div *ngIf="showMe"> 
     obs2: {{ _obs2 | async }} 
     </div> 
    </div> 
    `, 
}) 
export class App { 

    private showMe = false; 

    private _subj1 = new BehaviorSubject<string>(); 
    private _subj2 = new Subject<string>(); 
    private _obs1 = this._subj1.asObservable(); 
    private _obs2 = this._subj2.asObservable(); 

    constructor() { 
    this.name = 'Angular2' 

    this._subj1.next('in constructor'); 
    } 

    ngAfterViewInit() { 
    this._subj2.next('after view init..'); 
    } 
} 

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