Sai Datta
Sai Datta

Reputation: 935

How to select from list of divs - Angular 2?

I am new to Angular 2. Here are a list of divs :

<div class="list">
 <div value="A">A</div>
 <div value="B">B</div>
 <div value="C">C</div>
 <div value="D">D</div>
 <div value="E">E</div>
</div>

How do I select only one div from this (like a radio list) and then handle the selected value ?

Upvotes: 3

Views: 1132

Answers (1)

Duannx
Duannx

Reputation: 8726

try this

<div class="list">
 <div value="A" [class.highlight]="selection=='A'" (click)="clickFunction('A')">A</div>
 <div value="B" [class.highlight]="selection=='B'"  (click)="clickFunction('B')">B</div>
 <div value="C" [class.highlight]="selection=='C'"  (click)="clickFunction('C')">C</div>
 <div value="D" [class.highlight]="selection=='D'"  (click)="clickFunction('D')">D</div>
 <div value="E" [class.highlight]="selection=='E'" (click)="clickFunction('E')">E</div>
</div>

selection = "A";
clickFunction(value){
console.log(value)
this.selection = value;

}

Upvotes: 6

Related Questions