I am working with an array of links where each element is an object containing a link, description, and category. I have different components to display these links, and I want each component to only display links from its specific category. So, I need to filter the array based on category.
I currently have a mock-up array that stores all the links.
I am attempting to filter the array of objects without using a pipe. The reason for this decision can be found here: https://angular.io/guide/pipes#appendix-no-filterpipe-or-orderbypipe
According to the Angular team's recommendation, it is better to handle filtering and sorting logic in the component itself rather than using a pipe:
@Component({
selector: 'startups',
templateUrl: './startups.component.html'
})
export class StartupsComponent implements OnInit {
constructor(private appLinksService: DigitalCoinHubService) { }
title = 'Startups';
links: DCHlinks[];
startupsLinks: DCHlinks [] = [];
getLinks(): void {
this.links = this.appLinksService.getLinks();
for (let i in this.links)
{
if (this.links[i].dchCategory == 'startups' )
{
this.startupsLinks.push(this.links[i]);
}
}
}
ngOnInit() {
this.getLinks();
}
}
Firstly, I retrieve the main array from the service:
this.links = this.appLinksService.getLinks();
Next, I attempt to create a new array that will only contain relevant links based on category. However, when trying to populate this new array using push method, I encounter an error:
Error: Property 'push' does not exist on type 'DCHlinks'.
The class definition for DCHlinks is as follows:
export class DCHlinks {
dchLink: string;
dchLinkTitle: string;
dchLinkDescription: string;
dchCategory: string;
}
Any suggestions on how to implement this simple filter without using a pipe?
Thank you!