當我使用時?，綁定效果很好。如果刪除它，則它在視圖中不會顯示任何內容。<span class="subhead">{{project?.category}}</span>你能告訴我區別嗎？以這種方式使用它是一種好習慣嗎？
3 回答
慕勒3428872
TA貢獻1848條經驗 獲得超6個贊
當Angular在project分配值之前渲染視圖時，將導致異常。?.停止評估何時projectis null或undefined，這通常發生在異步獲取數據的情況下，例如從服務器獲取數據可能會花費一些時間。
下次更改檢測識別到更改時，將重新評估綁定。當project有一個值時，它將綁定project.category。
函數式編程
TA貢獻1807條經驗 獲得超9個贊
這個安全的導航運算符可防止在獲取值之前渲染視圖。
我們可以通過以下三種方法來修復視圖模板中未定義或空值的錯誤。顯然還有其他方法。
方法1：使用安全導航運算符
<span class="subhead">{{project?.category}}</span>
方法2：使用異步管道
<span class="subhead">{{(project | async )?.category}}</span>
如果要通過@Input()裝飾器從應用程序組件中獲取價值，則可以在應用程序組件中簡化這樣的代碼
@Component({
selector: 'my-app',
template: `
<div>
<app-project [project]="project | async"></app-project>
</div>
`,
})
export class App { ... }
您可以在子組件（例如，項目組件）中使用以下模板
<span class="subhead">{{project.category}}</span>
方法3：通過*ngIf結構指令限制視圖
<span class="subhead" *ngIf="project">{{project.category}}</span>
- 3 回答
- 0 關注
- 570 瀏覽
添加回答
舉報
0/150
提交
取消