NgFor中的角度2對象插值問題/ NgIf

對於一組User對象，我有一個*ngFor。在此ngFor內部是一個帶有*ngIf的div，並且在該div內部是具有插值src屬性的<img>標籤。NgFor中的角度2對象插值問題/ NgIf

<md-card *ngFor="let user of users" [user]="user" style="background-color: rgb(48, 48, 48) !important;"> 
    <md-card-title-group class="gotham" style="color: rgb(93, 93, 93) !important; font-family: 'Gotham' !important;"> 

    <md-card-title style="width: 200px !important; text-overflow: ellipsis !important; display: inline-block; overflow: hidden;"><span class="gotham">{{user.username}}</span></md-card-title> 
    <md-card-subtitle class="gotham" style="color: rgb(161, 161, 161) !important;"><span class="gotham">User since {{ user.datejoined | date:'fullDate' }}</span></md-card-subtitle> 
    <md-list> 
    </md-list> 
    <div *ngIf="user.fbdetails" style="display: inline-block; float: right;"><img style="width: 40px; height: 40px;" src="app/assets/facebook_circle_color-512.png"/></div> 
    <div *ngIf="user.twitterdetails" style="display: inline-block; float: right;"><img style="width: 40px; height: 40px;" src="app/assets/twitter_circle_color-256.png"/></div> 
    <i *ngIf="!user.fbdetails.picture.data.url" class="material-icons" style="font-size: 60px; color: white !important; display: inline-block; float: right;">people</i> 
    <div *ngIf="user.fbdetails" style="display: inline-block; float: right;"><img style="width: 60px; height: 60px;" src="{{user.fbdetails.picture.data.url}}"/></div> 
    </md-card-title-group> 
</md-card>

現在包裝了<img>如果有對象層次沒有user.fbdetails不應顯示DIV。這適用於幾乎所有有問題的用戶（大多數沒有fbdetails）。這意味着綁定{{user.fbdetails.picture.data.url}}的內插值未被填充，但*ngIf應阻止這些綁定存在，如果沒有fbdetails。然而，我仍然得到一個Cannot read property "picture" of undefined的錯誤，儘管由於*ngIf而不應該發揮作用。

這是我在Angular 1中經常做的事情，所以我不確定發生了什麼。

來源

2016-08-18 P Ackerman

使用安全導航操作畫面應該解決您的問題

<i *ngIf="!user.fbdetails?.picture?.data?.url"

這如果fbdetails是null，角度不會丟。

來源

2016-08-19 04:31:01

甚至不知道這存在。這是角度2還是打字稿？這個是從哪裏來的？ –

它是Angular2模板語法。 AFAIK它被認爲是增加到ES6但尚未降落。 –

錯誤，你得到是

<i *ngIf="!user.fbdetails.picture.data.url" class="material-icons" style="font-size: 60px; color: white !important; display: inline-block; float: right;">people</i>

它試圖讀取user.fbdetails

來源

2016-08-19 03:03:03

NgFor中的角度2對象插值問題/ NgIf

回答

相關問題