Angular 7 активирует маршруты, все активные после обновления

Когда я перезагружаю / обновляю свое приложение, отображаются маршруты в меню, и все элементы устанавливаются на active, Я настроил для маршрутов:

export const routes: Routes = [
  {
    path: '', pathMatch: 'full', redirectTo: 'home',
    data: { title: undefined }
  },
  {
    path: 'login', component: LoginComponent,
    data: { title: 'Login' }
  },
  {
    path: 'home', component: MainComponent,
    data: { title: 'Home' }
  },
  {
    path: 'search',  component: SearchListComponent,
    data: { title: 'Search'}
  },
];

В моей строке меню я сократил код до следующего:

<div class="container">
    <a routerLinkActive="is-active" 
       routerLink="/login">Login</a> |
    <a routerLinkActive="is-active" 
       routerLink="/search">MySearch</a> |
    <a routerLinkActive="is-active" 
       routerLink="/home">MyHome</a> |
</div>

<div >
  <div *ngFor="let route of router.config">
    <a routerLinkActive="is-active" 
        [routerLink]="userName? ('/'+route.path ): '/' ">{{route.data.title}}... {{userName? ('/'+route.path ): '/' }} </a> |
  </div>
</div>

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

Согласно документу routerLink можно использовать как строку

Кто-нибудь может объяснить мне, почему второй отказывает?

РЕДАКТИРОВАТЬ: В соответствии с просьбой Picuture

но содержание остается тем же после того, как я выбрал другую ссылку! Все ссылки отображаются правильно!

EDIT2

Я был в состоянии воспроизвести ошибку. Основная проблема заключается в том, что оценка routerlink было сделано слишком поздно, и я столкнулся с той же проблемой, что и в уже сообщенной ошибке.

Мое текущее решение: сначала установите userName:-/

1 ответ

Попробуйте добавить [routerLinkActiveOptions]="{ exact: true }" на ваши сгенерированные ссылки. По умолчанию угловой маршрутизатор будет соответствовать любой части.

Другие вопросы по тегам