В Angular 2 как назначить настраиваемый класс для ссылки активного маршрутизатора?

Структура автоматически присваивает класс router-link-active, когда путь соответствует маршруту с именем "Main". Что делать, если я хотел бы предоставить ему собственный класс (возможно, без ввода Location или любой другой службы в контроллере)?

Ответы

Ответ 1

AFAIK не поддерживается напрямую. В качестве обходного пути вы можете добавить директиву, которая проверяет, установлен ли класс router-link-active и в зависимости от того, добавляет/удаляет ваш пользовательский класс.

@Directive({
  selector: '[routerLink]')
export class RouterLinkReplaceClass {
  // add class `my-active` when `myActiveClass` is `true`
  @HostBinding('class.my-active') 

  // read `router-link-active` class state
  @Input('class.router-link-active') 

  myActiveClass: bool = false;
}

Пример плунжера

Чтобы использовать его, просто добавьте его в директивы родительского компонента. (не проверено)

Ответ 2

Я нашел что-то, чтобы справиться с этим в проекте AngularClass. Проверьте пользовательский RouterDirective. Кажется, это способ получить эту обработку, но я еще не добавил ее в свой проект.