核心提示：HTMLCSS基础CSS 控制 ul中li选中与不选中的样式。ul class=heroesli *ngFor=let hero of heroes[class.selected]=hero === ...
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事件中）
