Angular2路由，如何在数据加载时避免错误

Question

我有一条路线：

@RouteConfig ([
    {path: '/dn/', name: 'Details', component: DetailsComponent}
])

DetailsComponent 在 ngOnInit 方法中加载数据。

数据显示在组件模板中，结构类似

{{data.prop1.prop2}}

但是只要没有加载数据，我就会得到错误，因为 data.prop1.prop2 还不存在。

angular2 中解决此问题的首选方法是什么？与

<span *ngIf="data">{{data.prop1.prop2}}</span>

还是使用 AsyncRoute，还是通过动态设置模板？

Answer 1

您可以使用猫王运算符

{{data?.prop1?.prop2}}

这样，Angular 不会尝试评估 prop1，直到 data 具有值 != null。