angular样式绑定

总结angular中的几种样式绑定方法，先上代码，自定义组件tabbar

<ul [ngStyle]="{ 'background-color': backgroundColor }">
  <li *ngFor="let menu of menus; let i = index ; let even = even; let odd = odd" 
      [ngClass]="{ even: even, odd: odd }"
    >
    <br>
    <a href="#" [class.active]="i === selectedIndex" (click)="handleSelection(i)">
      {
  { menu.title }}
    </a>
    <br>
    <a href="#" [ngStyle]="{ color: i === selectedIndex ? titleActiveColor : titleColor }" (click)="handleSelection(i)">
      {
  { menu.title }}
    </a>
    <span class="indicator" *ngIf="i === selectedIndex "></span>

  </li>
</ul>

运行效果如下：