How to update a variable inside forEach function? Getting Cannot read property of undefined

Question

export class myclass implements OnInit {
    private outagesList;
    private outageArray;

    constructor(private outages: OutagesService){}

    ngOnInit(){
        this.outages.getOutagesList().subscribe((data) => {
            this.outagesList = data;
            this.outagesList.forEach( function (arrayItem)  
            {             
              this.outageArray.push(arrayItem["title"]);          
            });
        )
}

If i try to push the data into outageArray it is throwing ERROR TypeError: Cannot read property 'outageArray' of undefined

How can i avoid this error? I need to access this outageArray value to html.

`this.outagesList.forEach((arrayItem) => { ... }` – ConnorsFan Mar 16 '18 at 13:40 — ConnorsFan, Mar 16 '18 at 13:40

score 2 · Accepted Answer · answered Mar 16 '18 at 13:40

2

Use an arrow function

this.outagesList.forEach((arrayItem) => {
  this.outageArray.push(arrayItem["title"]);         
});

answered Mar 16 '18 at 13:40

Sajeetharan

216,225
63
350
396

2

This question has already been answered hundreds of times. Do we need one more answer? – ConnorsFan Mar 16 '18 at 13:41

score -1 · Answer 2 · answered Mar 16 '18 at 13:42

Once you are using post-ES6 Javascript, functions like forEach are not likely to be your best solution. The easiest way to do this is with a for..of loop:

this.outages.getOutagesList().subscribe((data) => {
    this.outagesList = data;
    for (let arrayItem of this.outagesList)
    {             
      this.outageArray.push(arrayItem.title);          
    });
)

How to update a variable inside forEach function? Getting Cannot read property of undefined

2 Answers2