I am currently in the process of transferring code from an AngularJS component to an Angular 5 component.
Within my code, I have stored an array of objects in a variable called productlist.
In my previous controller, I initialized another empty array named showcaselist.
To filter out specific items that meet a certain condition (
item.acf.product_slide.length > 0productlist, I utilized a forEach loop and added them to the showcaselist. These filtered items are then displayed in the template.
Despite successful data retrieval and conditional statement execution confirmed by console logging, I keep encountering a console error:
TypeError: undefined is not an object (evaluating 'this.showcaselist')Below is the complete code snippet for the component:
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
@Component({
selector: 'pb-ds-showcaseindex',
templateUrl: './showcaseindex.component.html'
})
export class ShowcaseindexComponent implements OnInit {
productlist;
showcaselist = [];
constructor(private _route: ActivatedRoute) { }
ngOnInit() {
this.productlist = this._route.snapshot.data.showcases;
this.itemsWithSlides();
}
itemsWithSlides = function () {
this.productlist.forEach(function (item) {
if (item.acf.product_slide.length > 0) {
this.showcaselist.push(item);
}
});
};
}