How to create a repeater that makes a new row every 3 items?

In my .ts file, I have an array of company details.

In my HTML, I'm then using ngFor to display these companies using the following code:

Industry: {{ company.industry }} Share Price: {{ company.sharePrice }} Rating: {{ company.starRating }}

Last updated 3 mins ago

This displays the companies on my page, but they are all in one row.

For example, if I have 3 companies, they are all in the same row. If I have 10 companies, they all stay on the same row.

What changes do I need to make so that there is only max 3 companies on one row of cards?

2 Replies