I have an *NgFor loop to write the rows of a table. But I would like to show only the first 10 results. Is there a way to break/stop the loop?
Somenthing like that:
<ng-container *ngFor="let row of rows">
<td>{{row.myCol1}}</td>
<td>{{row.myCol2}}</td>
<td>{{row.myCol2}}</td>
...
</ng-container>
Angular slice pipe's one of the application is for slicing arrays (other being slicing string).
Try the following
<ng-container *ngFor="let row of rows | slice:0:10">
<td>{{row.myCol1}}</td>
<td>{{row.myCol2}}</td>
<td>{{row.myCol2}}</td>
...
</ng-container>
You can use index in for loop.
<ng-container *ngFor="let row of rows;let i = index">
<ng-container *ngIf="i <= 10">
<td>{{row.myCol1}}</td>
<td>{{row.myCol2}}</td>
<td>{{row.myCol3}}</td>
</ng-container>
</ng-container>
Or you can create subarray in your ts and iterate over it.
n: number = 10;
const subArray = rows.slice(0, n);
