角度TypeError：無法讀取“名稱”的屬性未定義

Question

我正在使用Angle 2 Release 6應用程序和以下代碼行：

<input #instance="ngbTypeahead" type="text" class="form-control" [(ngModel)]="item.outputProjection.name" [ngbTypeahead]="search" />   

並且出現以下錯誤：

DatacartComponent.html:60 ERROR TypeError: Cannot read property 'name' of undefined
at Object.eval [as updateDirectives] (DatacartComponent.html:60)
at Object.debugUpdateDirectives [as updateDirectives] (core.js:11914)
at checkAndUpdateView (core.js:11307)
at callViewAction (core.js:11548)
at execEmbeddedViewsAction (core.js:11511)
at checkAndUpdateView (core.js:11308)
at callViewAction (core.js:11548)
at execEmbeddedViewsAction (core.js:11511)
at checkAndUpdateView (core.js:11308)
at callViewAction (core.js:11548)

而且我不太確定該如何做才能更好地檢查預引導類型上的對象定義。

Answer 1

請確保undefined item.outputProjection 。

解決方法是在組件.ts文件中定義item.outputProjection = {} 。

Answer 2

你可以試試這個嗎

<input #instance="ngbTypeahead" type="text" class="form-control" [(ngModel)]="item.outputProjection?.name" [ngbTypeahead]="search" /> 

item.outputProjection？.name不會拋出未定義的錯誤，它將檢查是否定義了item.outputProjection，如果是，則從中獲取名稱。

Answer 3

不幸的是，我無法將Elvis運算符添加到具有2種方式綁定的ngModel中，所以我做到了這一點，並且有效。

[(ngModel)]="item && item.outputProjection && item.outputProjection.name"

而且有效！