Angular2 - 将UI绑定到可观察属性

我正在使用Angular 2和rxjs observable。我已经创建了这个接口：Angular2 - 将UI绑定到可观察属性

interface IGame { 
    name: string; 
    description: string; 
}

我使用它作为一个可观察到的和将它作为输入到UI：

@Input() public game: Observable<IGame>;

问题是，当在UI绑定整个对象等时这个我可以看到它的价值和打印显示：

<h3>{{game | json}}</h3>

当使用绑定特定的属性（其中，当然其游戏的一部分）没有在屏幕上 - 只是一个抢先y字符串：

<h3>{{game.name}}</h3> 
<h3>{{game.description}}</h3>

有没有可能？我应该将名称&描述作为不同的输入吗？

来源

2016-06-07 Lior Kooznits

的async管确实在视图绑定订阅

<h3>{{(game | async)?.name}}</h3>

的?是仅在必要时null值可能被发射。

来源

2016-06-07 06:34:25

太棒了！这是多么棘手。 –

Thx，非常有帮助 –

下面是一个例子

// the controller 
import { Component, OnInit } from '@angular/core'; 
import { Observable }  from 'rxjs/Observable'; 
// your controller metadata 
// .... 
export class ListComponent implements OnInit { 
    vehicles: Observable<Array<any>> 
    ngOnInit() { 
     this.vehicles = Observable.interval(2200).map(i=> [{name: 'car 1'},{name: 'car 2'}]) 
    } 
} 
// in the template 
<div *ngFor='let vehicle of vehicles | async'> 
    {{vehicle.name}} 
</div>

来源

2016-06-07 08:57:37

嗨Relu，你为什么要绑定到Observable >而不是Observable ？不应该观察车辆是从后端加载的汽车流？更换时更换整个系列是不是很昂贵？ –

只是一个例子。随它吧 – JSF

Angular2 - 将UI绑定到可观察属性

回答

相关问题