Angular2 - 分配＆＃34; ngClass＆＃34;仅限当前元素

Question

我只想为ngClass分配被点击的元素;但是，它被分配给所有其他元素。

html的

    <div class="likeBtn" (click)="like()" [ngClass]="{'likeBtnClicked': clicked}" item-right>I like</div>

.TS

like(){
clicked = true;
}

Answer 1

这里是html：

<div class="likeBtn" (click)="like(like1.id)"  #like1 id="1"
    [ngClass]="{'likeBtnClicked':  likes[like1.id]}" item-right>I like</div>

  <div class="likeBtn" (click)="like(like2.id)" #like2 id="2"
        [ngClass]="{'likeBtnClicked': likes[like2.id]}" item-right>I like</div>

`

这里是有喜欢的地图的组件和添加新的方法，如：

 export class App {
  likes = {};

  like(id) {
   this.likes[id] = true;
  }
 }