我使用github API在我的angular 2应用程序中加载用户及其关注者数据,但在ngOnInit完成加载数据之前查看渲染,因此我收到:
Cannot read property of undefined
错误。我的代码片段如下所示:
ngOnInit() {
Observable.forkJoin(
this._githubService.getUser('kaxi1993'),
this._githubService.getFollowers('kaxi1993')
)
.subscribe(res => {
this.user = res[0];
this.followers = res[1];
},
null,
() => {
this.isLoading = false;
});
}
如果我写这样的HTML代码:
<div *ngIf="user && user.avatar_url">
<img class="media-object avatar" [src]="user.avatar_url" alt="...">
</div>
工作正常,但在编写没有Cannot read property 'avatar_url' of undefined
的html代码时会返回错误*ngIf
,如下所示:
<img class="media-object avatar" [src]="user.avatar_url" alt="...">
另请注意:getFollowers
工作正常,但如果我搬家
在getFollowers
方法getUsers
之前的forkJoin
,getUsers
工作正常,getFollowers
需要*ngIf
以避免错误。
是否可以在没有额外* ngIf代码的情况下编写?任何帮助的人,非常感谢。
答案 0 :(得分:11)
您可以使用安全导航(Elvis)操作符来避免错误,如
<div *ngIf="user?.avatar_url">
<img class="media-object avatar" [src]="user.avatar_url" alt="...">
</div>
或
<img class="media-object avatar" [src]="user?.avatar_url" alt="...">