CODEWITHSUNDEEP
javascriptangular
Asridh Kumar
Asridh Kumar

Reputation: 525

Is it possible to increment a component property value inside *ngFor?

I would like to increment a class property inside ngFor for each iteration by 1.Let me know if there is a way.Thanks in advance.

Component Class:

class AA
   {      
  property:number = 0;
   }

Template:

 <div *ngFor = "let sample of samples">
    //increment property here
 </div>

Upvotes: 3

Views: 5245

Answers (2)

Megametres
Megametres

Reputation: 11

Just create a function in your class and call it into the ngfor bloc

class AA
   {      
  property:number = 0;
  
  function increment_property(): void{
    this.property++;
  }
   }

<div *ngFor = "let sample of samples">
    {{ increment_property() }}
 </div>

Upvotes: 1

Muhammed Albarmavi
Muhammed Albarmavi

Reputation: 24404

You can use index

 <div *ngFor = "let sample of samples;let i = index">
    <span [class]="'opacity-'+(i+1)">value {{i+1}}</span>
    <button (click)="property = (i+1)">Set Selected Item</button>
 </div>
Selected Item : {{property}}

Upvotes: 2

Related Questions