routerLinkActive Не применяется класс

Question

У меня есть меню и два элемента в нем. Я хочу применить определенный класс на основе маршрута с помощью routerLinkActive. Но занятия не применяются. Ошибка, которую я получаю:

Ошибка: Uncaught: InvalidCharacterError: Не удалось выполнить «add» для «DOMTokenList»: предоставленный токен («demo_class demo_class - active») содержит пространство HTML

Мой код в component.html

<nav class="class-bar">
    <ul class="class-bar__menu">
      <li class="class-bar__item">
        <a [routerLinkActive]="['demo_class demo_class--active']"  routerLink = "/xyz">Item1</a>
      </li>
      <li class="class-bar__item">
        <a [routerLinkActive]="['demo_class demo_class--active']" [routerLink] = "['/abc']">Item2</a>
      </li>

    </ul>
  </nav>

Answer 1

Попробуйте установить свой код, как показано ниже:

<a routerLinkActive="demo_class"
   [routerLinkActiveOptions]="{ exact: true }"
   routerLink="/xyz">Item1</a>

Answer 2

попробуйте этот метод

 <li routerLinkActive="'demo_class demo_class--active'">