color element in a list onclick angular

1<ul class="horizontal" id="nav">
2  <li 
3    *ngFor="let state of states"
4    (click)="setStateAsActive(state)">
5    <a [class.active]="state === activeState">
6      {{ state }}
7    </a>
8  </li>
9</ul>
10
11import { Component } from '@angular/core';
12
13@Component({
14  selector: 'my-app',
15  templateUrl: './app.component.html',
16  styleUrls: [ './app.component.css' ]
17})
18export class AppComponent  {
19  activeState = 'Draft';
20
21  states = [
22    'Draft',
23    'Planned',
24    'Started',
25    'Suspended',
26    'Ended',
27  ]
28
29  setStateAsActive(state) {
30    this.activeState = state;
31  }
32
33}