HTMLCSS基础

    CSS 控制 <ul>中<li>选中与不选中的样式。

<ul class="heroes">
              <li *ngFor="let hero of heroes"
                [class.selected]="hero === selectedHero"
                (click)="onSelect(hero)">
                <span class="badge">{{hero.id}}</span> {{hero.name}}
              </li>
            </ul>

.selected {
    background-color: #CFD8DC !important;
    color: white;
  }

其中selectedHero用来记录选中的li， （selectedHero的赋值在onSelect事件中）