Question

我正在使用Angular4。我的打字稿文件中有一个Windows Timer订阅的observable。

    this.dynamicTime = new Observable<string>((observer: Subscriber<string>) => {
        setInterval(() => observer.next(this.computeTime()), 1000);
    });

在我的HTML方面，我正在使用它。

<h1>
<div>{{ dynamicTime | async }}</div>

这很有效。

但是，如果我将变量“dynamicTime”的类型从Observable<string>更改为Observable<SomeClass>类对象。那它不起作用。有趣的是Windows计时器本身失败了。控件不会点击计时器功能“computeTime（）”。

这就是改变的方式。

    this.dynamicTime = new Observable<SomeClass>((observer: Subscriber<SomeClass>) => {
        setInterval(() => observer.next(this.computeTime()), 1000);
    });

在HTML方面，

   <h1>
<div>{{ dynamicTime.someProperty | async }}</div>

看起来HTML方面没有识别出“someProperty”。 “someProperty”在“SomeClass”类中声明为public。

不确定我在这里缺少什么。请指教。

由于亚当

Answer 1

dynamicTime是Observable。它没有名称为someProperty的属性。

为了获得属性，您应首先使用异步管道解包observable。 AsyncPipe订阅了observable并返回具有SomeClass属性的someProperty实例。

我会这样做

{{ (dynamicTime | async)?.someProperty }}

<强> Plunker Example

注意我也在这里使用安全导航操作符?.来防止对象未解析时的错误

如何在HTML

1 个答案: