Там может быть простой способ сделать это. Если у вас есть routerLink в панели навигации, который ссылается на ваш домашний компонент, вы можете использовать директиву routerLinkActive, чтобы узнать, активен ли в данный момент маршрут.
<a [routerLink]="['/home']" routerLinkActive #homeActive="routerLinkActive">
Со второй частью #homeActive="routerLinkActive"
вы определяете переменную шаблона, которая будет либо истинной, либо ложной, в зависимости от того, находимся ли мы на домашнем маршруте.
Затем на панели навигации вы можете использовать эту переменную для управления классом.
<nav class="..." [class.bg-primary]="!homeActive">
Класс bg-primary
будет применяться, когда домашний маршрут не активен.
Если я не ошибаюсь, вы должны убедиться, что ваш домашний маршрут отличается от /
, иначе routerLinkActive будет иметь значение true для каждого маршрута.
См. В документы для более подробной информации о директиве.