如何在angular dart项目中设置路线上活动导航链接的样式？

import 'package:angular/angular.dart';
import 'package:angular_router/angular_router.dart';

@Component(
  selector: 'my-component',
  templateUrl: 'my_component.html',
  styleUrls: ['my_component.css'],
  directives: [routerDirectives],
)
class MyComponent {
  final List<RoutePath> routes = [
    RoutePath(path: '/home', useAsDefault: true),
    RoutePath(path: '/about'),
    RoutePath(path: '/contact'),
  ];

  RoutePath activeRoute;
}

<ul>
  <li *ngFor="let route of routes" [ngClass]="{'active': route == activeRoute}">
    <a [routerLink]="route.path">{{route.path}}</a>
  </li>
</ul>

import 'package:angular/angular.dart';
import 'package:angular_router/angular_router.dart';

@Component(
  selector: 'my-component',
  templateUrl: 'my_component.html',
  styleUrls: ['my_component.css'],
  directives: [routerDirectives],
)
class MyComponent implements OnActivate {
  final List<RoutePath> routes = [
    RoutePath(path: '/home', useAsDefault: true),
    RoutePath(path: '/about'),
    RoutePath(path: '/contact'),
  ];

  RoutePath activeRoute;

  @override
  void onActivate(_, RouterState current) {
    activeRoute = current.routePath;
  }
}

li.active {
  font-weight: bold;
}