如何在HTML中绑定Observable <any>单个类对象

Ada*_*dam 1 binding timer observable angular

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

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

在我的HTML方面,我正在使用它.

<h1>
<div>{{ dynamicTime | async }}</div>
Run Code Online (Sandbox Code Playgroud)

这非常有效.

但是,如果我将变量"dynamicTime"的类型更改Observable<string>Observable<SomeClass>类对象.那它不起作用.有趣的是Windows计时器本身失败了.控件不会点击计时器功能"computeTime()".

这就是变化的样子.

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

在HTML方面,

   <h1>
<div>{{ dynamicTime.someProperty | async }}</div>
Run Code Online (Sandbox Code Playgroud)

看起来HTML方面没有认识到"someProperty"."someProperty"在"SomeClass"类中声明为public.

不知道我在这里缺少什么.请指教.

谢谢亚当

yur*_*zui 5

dynamicTime 是一个Observable.它没有名称的财产someProperty.

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

我会这样做的

{{ (dynamicTime | async)?.someProperty }}
Run Code Online (Sandbox Code Playgroud)

Plunker示例

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