[Solved] How can you use *ngFor to display only even-indexed items from a list named numbers? — Ans: *ngFor="let num of numbers; let i = index" with <div *ngIf="i % 2 === 0"> | Angular

Angular - Directives

How can you use *ngFor to display only even-indexed items from a list named numbers?

A*ngFor="let num of numbers | filterEven"

B*ngFor="let num of numbers; let i = even"

C*ngFor="let num of numbers" with <code>if(i % 2 === 0)</code> inside template

D*ngFor="let num of numbers; let i = index" with <code><div *ngIf="i % 2 === 0"></code>

Step-by-Step Solution

Solution:

Step 1: Understand filtering in Angular templates
*ngFor does not support filtering directly, so use *ngIf inside the loop.
Step 2: Use index to filter even items
Check if index modulo 2 equals 0 to show even-indexed items.
Final Answer:
*ngFor="let num of numbers; let i = index" with <div *ngIf="i % 2 === 0"> -> Option D
Quick Check:
Filter inside loop with *ngIf using index [OK]

Quick Trick: Use *ngIf inside *ngFor to filter items by index [OK]

Common Mistakes:

Master "Directives" in Angular

9 interactive learning modes - each teaches the same concept differently

More Angular Quizzes

How can you use *ngFor to display only even-indexed items from a list named numbers?