跟随插值
{{ (__responseData | async)?.calculation | json }}
输出遵循结构
[
{
"gross": 26.625834,
"net": 20.425833,
"tax": 6.2000003
}
]
我怎么能变得恶心?
{{ (__responseData | async)?.calculation[0].gross }}
不起作用,以下所有尝试也不起作用:
{{ (__responseData.calculation[0] | async)?.gross }}
{{ (__responseData.calculation.[0].gross | async) }}
怎么了?
编辑:作为解决方法,我使用flatmap(
this.__responseData.flatMap((data: any) => data.calculation);
),但我想有一个优雅的解决方案,… 最佳答案
这是Alexander的答案(angular2 github平台)
您可以使用*ngfor=“让计算异步”
@Component({
selector: 'my-app',
providers: [HTTP_PROVIDERS],
template: `
<div *ngFor="let calculation of calculations | async">
Gross: {{ calculation.gross }}<br>
Net: {{ calculation.net }}
</div>
`,
directives: [NgFor]
})
export class App {
calculations: Observable<{gross:number; net:number}[]>;
constructor(private _http: Http) {
this.calculations = this._http.get("./data.json")
.map(res => res.json().calculation)
}
}
http://plnkr.co/edit/3ze70dYycQxNyXA286mX?p=preview