Angular, RouterLinkActive включая фрагменты?

В приложении Angular для маршрутизации мы используем routerActiveLink для добавления класса CSS к ссылке или родительскому элементу, когда пользователь переходит по ссылкам.

<li routerLinkActive="active activeClass2">
    <a routerLink="/page">Inicio</a>
  </li>

Приведенный выше код добавит active и activeClass2 к элементу li, когда пользователь перейдет по URL-адресу /page.

Но иногда мы хотим перейти к разделу на странице, используя старую школу, с помощью сегментов, имеющих id, прикрепленных к сегменту / div.

Для нашего проекта мы использовали ту же навигацию по страницам, используя эти сегменты (id). Для сегментной навигации по странице в Angular есть directive, называемый fragment., поэтому код будет выглядеть так.

  <li routerLinkActive="active">
    <a routerLink="/sitio" fragment="inicio">Inicio</a>
  </li>
  <li routerLinkActive="active">
    <a routerLink="/sitio" fragment="invierte">Invierte</a>
  </li>
  <li routerLinkActive="active">
    <a routerLink="/sitio" fragment="contacto">Contacto</a>
  </li>

Приведенный выше код работает, но проблема с приведенным выше кодом заключается в том, что routerLinkActive добавит класс active ко всем элементам.

Решением вышеупомянутой проблемы, по мнению некоторых пользователей, является добавление [routerLinkActiveOptions]="{ exact: true }" вместе с `routerLinkActive`, но, похоже, это работает только после версии маршрутизатора 7.2.4.

Мое решение ActivatedRoute. Вставьте это в компонент.

class ComponentClass{
  activeFragment = this.route.fragment.pipe(share()); 
  constructor(public route: ActivatedRoute){}
}

Теперь используйте это в template как.

<li [class.active]="(activeFragment | async)==='inicio'">
    <a routerLink="/sitio" fragment="inicio">Inicio</a>
</li>
<li [class.active]="(activeFragment | async)==='invierte'">
    <a routerLink="/sitio" fragment="invierte">Invierte</a>
</li>
<li [class.active]="(activeFragment | async)==='contacto'">
    <a routerLink="/sitio" fragment="contacto">Contacto</a>
</li

Сообщите мне, поможет ли вам этот код или у вас есть лучшее решение.

Спасибо!