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>

div 在 DOM 中保留评论，一个 Angular Ghost。

如果我删除 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：我读过，但 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>

ngif 保持错误，即使它的值是正确的

ngif stays false, even though its value is right

html

store

typescript

redux

angular