CODEWITHSUNDEEP
angulartypescriptionic-framework
CoderTn
CoderTn

Reputation: 997

TypeError: Cannot read property 'title' of undefined in angular

i have an array :

content =    [ { title : 'Canal notifications' , subtitle: ['Notification Push','Email']} , { title : 'Canal notifications' , subtitle: ['Notification Push','Email']} ];

i want to iterate this array using ngFor :

   <app-toggle-element *ngFor="let element of content; let i = index" [title]="element[i]['title']" [subtitle]="element[i]['subtitle'][i]" ></app-toggle-element>

i get this error :

Cannot read property 'title' of undefined

Upvotes: 0

Views: 141

Answers (2)

er-sho
er-sho

Reputation: 9771

You have used the *ngForOf structural directive which is responsible to add your HTML in existing DOM elements.

And also the iteration variable element that you used in *ngForOf repeater is represent the current iteration data which contains your title and subtitle also,

So instead of fetching title and subtitle with array indexing, you can use the data contains in above iteration variable like,

Here doesn't know why you fetch the current index subtitle, but I have added here demo with your requirement

<app-toggle-element *ngFor="let element of content; let i = index" [title]="element.title" [subtitle]="element.subtitle[i]" >
</app-toggle-element>

Stackblitz Demo

Upvotes: 1

tmsbrndz
tmsbrndz

Reputation: 1347

try this :

[title]="element.title"

You are iterate through array. In element variable is the current element of iteration.

Upvotes: 0

Related Questions