ngif保持假的，即使它的值是正確

Question

我的代碼如下所示：

component.ts

export class ViewScaleComponent implements OnInit { 
    private range$: Observable<number>; 
    constructor(private store: Store<AppState>) {} 

    ngOnInit() { 
     this.range$ = this.store.select(x => x.view.range); 
    } 
} 

component.html：

<div *ngIf="(range$ | async)"> 
    here {{ range$ | async }} 
</div> 

股利留在評論DOM，一個角度的鬼魂。

如果我刪除ngif，則會出現div，但數據插值不會提取任何內容（僅此處和下面的空格出現）。

如果ngOnInit()我做的：

this.range$ = this.store.select(x => x.view.range).do(x => console.log(x)); 
console.log("on init " + this.range$); 

然後我得到：

on init [object Object] 
undefined 
21 

其中最後兩個控制檯日誌來自同一行（do()）。我想知道第一個undefined是不是顯示di的原因。

值得一提的是，有時它工作（我看到了div和預期正在更新的range$值）。

任何想法？

PS：我讀了angular 2 ngIf with observable?，但可觀察的和async的組合看起來很像我的。

Answer 1

你不需要的ngIf這只是把{{ range$ | async}}

更新

range:any ; 
ngOnInit() { 
    this.store.select(x => x.view.range).subscribe(x => this.range = x); 
} 

模板

<div *ngif="range"> 
    here {{ range }} 
</div>