[如何根据routerLinkActive状态角度改变垫图标的颜色？

<a routerLink="/home" routerLinkActive="active">Home</a>
<a routerLink="/about" routerLinkActive="active">About</a>

.active {
  color: red;
}

<a routerLink="/home" [ngClass]="{'active': isActive('/home')}">Home</a>
<a routerLink="/about" [ngClass]="{'active': isActive('/about')}">About</a>

import { Component } from '@angular/core';
import { Router } from '@angular/router';

@Component({
  selector: 'app-navbar',
  templateUrl: './navbar.component.html',
  styleUrls: ['./navbar.component.css']
})
export class NavbarComponent {
  constructor(private router: Router) {}

  isActive(route: string): boolean {
    return this.router.isActive(route, true);
  }
}