如何使用异步管道从Angular2组件中使用单个Observable属性?

时间:2016-05-05 18:37:05

标签: asynchronous typescript angular observable rxjs5

如果我的组件属性为:

import { Component, OnInit } from 'angular2/core';
import { CarService } from 'someservice';

@Component({
    selector: 'car-detail',
    templateUrl: './app/cars/car.component.html'
})

export class CarComponent implements OnInit {

    model: Observable<Car>;

    constructor(
        private _carService: CarService
    ) { }

    ngOnInit() {
        // begin benefit setup
        this.model = this._carService.get(5);
    }
}
例如,我希望在我的视图中使用异步管道来订阅它并将属性用作文本,你怎么能实际订阅它?例如:

<template #mycar = "model | async" >
    <p>{{ myCar?.make }}</p> 
</template>

我是Angular2的新手,不确定我是否做错了。

2 个答案:

答案 0 :(得分:2)

我相信您已经接近一个好的解决方案。

<template *ngIf = "model | async as mycar" >
    <p>{{ mycar.make }}</p> 
</template>

答案 1 :(得分:0)

尝试:

<template #mycar = "model | async" >
    <p>{{ (myCar | async).make }}</p> 
</template>