angular *ngFor循环出的内容可以点击选择多个

Question

我用*ngFor循环出了内容

我想点击某个标签时标签颜色改变 再次点击变回原来的颜色 并且可以多选
大佬们 这个效果要如何实现啊
以下是我的代码

Answer 1

我的方案是封装一下 labels 将其替换成 Object, libraryService.labelsArry 封装成
Object 数组

{
   text:'test',
   selected: false
}

然后在 span 上添加一个 class ，由 selected 决定

html:
<span *ngFor="let labels of libraryService.labelsArry" [class.selected]="labels.selected"   (click)="chooseLabel(labels)"  >{{labels.text}} </span>

css:

  .selected{
      color : red;
  }


ts:
chooseLabels(item){
   item.selected=!item.selected;
}