Reputation: 935
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
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