Angular 2无法调用嵌套的json

时间:2016-02-24 03:17:04

标签: angular

简而言之,如果我打电话

{{ foo.bar | json }}

其中foo是json对象,bar是foo中的json对象,Angular 2会将数据加载到foo.bar中,并显示json对象。如果我尝试foo.bar.baz,则错误

EXCEPTION: TypeError: Cannot read property 'name' of undefined in [
{{ foo.bar.baz | json }}
in BarComponent@1:9]

如何从这个json中提取我需要的数据?

foo.bar对象:

这里是foo.bar的内容:

{ "displayName": null,
"facebookUrl": null, 
"featureCountry": null, 
"id": "some-uuid", 
"name": "Fake Name", 
"permalink": "fake-name", 
"placeIds": [], 
"redemptionProcesses": [ "PAPER_VOUCHER", "DIGITAL_VOUCHER" ], 
"salesforceAccountId": "sfid123",
"websiteUrl": "http://fake.com"
}

具体来说,我试图提取姓名& websiteUrl。

我还有另一个类似的设置,除了它是一个json数组我用ngFor迭代。这很好。

1 个答案:

答案 0 :(得分:0)

很可能,您的模板在http.get()请求返回并填充数据之前尝试呈现数据。使用Elvis operator, ?.(请参阅@ Eric的评论),或使用NgIf

<div *ngIf="yourObject">
     {{yourObject.name}}
</div>

NgFor可能有效,因为该数组最初是空的,不会产生错误,因为在数据从服务器返回之前没有任何内容可以循环。