angular TypeError: Cannot read property of 'name' undefined

Question

I am working on a angular 2 release 6 app and on the following line of code :

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

and I'm getting the following error:

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)

and I'm not really sure what to do to better check object definitions on the bootstrap typeahead.

Possible duplicate of Angular2: Cannot read property 'name' of undefined — Martin Parenteau
– Martin Parenteau, Commented Jun 26, 2018 at 3:09

Dinh Duong · Accepted Answer · 2018-06-26 01:45:18Z

5

Please make sure item.outputProjection is not undefined.

Workaround for you is define item.outputProjection = {} in your component .ts file.

answered Jun 26, 2018 at 1:45

Dinh Duong

2972 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

yamamoto585 Over a year ago

thank you, didn't even think of that. I also had to initialize name as well.

yamamoto585 · Accepted Answer · 2018-06-26 15:55:36Z

2

unfortunately I could not add a elvis operator to a ngModel with 2 way binding so I did this and it worked.

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

And it worked!

answered Jun 26, 2018 at 15:55

yamamoto585

3811 gold badge6 silver badges16 bronze badges

Comments

Padmapriya Vishnuvardhan · Accepted Answer · 2018-06-26 02:28:48Z

1

Can you try this.

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

item.outputProjection?.name will not throw undefined error, it will check for item.outputProjection is defined and if it is so, will fetch name from it.

answered Jun 26, 2018 at 2:28

Padmapriya Vishnuvardhan

2,16616 silver badges18 bronze badges

Collectives™ on Stack Overflow

angular TypeError: Cannot read property of 'name' undefined

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related