Home > Software design >  Is it possible to loop 1, 4, 7, 10 sequence directly in ngFor from an array?
Is it possible to loop 1, 4, 7, 10 sequence directly in ngFor from an array?

Time:11-30

Is it possible to loop 1, 4, 7, 10 sequence directly in ngFor from an array?

I tried in ts like regular for loop with i =3. But need 1,4,7,10 pattern directly in ngFor without a loop in ts file.

CodePudding user response:

ngFor is very similar to the .ForEach() method.

You could use an ngIf statement to check if the index is divisible by 3 before displaying it.

    <div *ngFor="item in itemlist, let i = index">
    <div *ngIf="i % 3 === 0">
{{item}}
    </div>
    </div>

You could also check the item directly instead of the index. Depending on how your array of numbers is set up.

CodePudding user response:

Here is the solution for your case, You just need to put this condition i % 3 === 1 which allows only 1, 4, 7, and 10;

  <div *ngFor="item of items, let i = index">
    <div *ngIf="i % 3 === 1">
       {{item}}
    </div>
  </div>
  • Related