Маршрутизатор Angular 8 работает только после перезагрузки страницы

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

навигация входа, которая работает в настоящее время

    this.usermanagementService.login('login', {username: userName, password})
    .subscribe(message => {
        this.jwt.saveToken(message.data.token);      

        if (window.localStorage.getItem('locale') === null) {
          window.localStorage.setItem('locale', 'en');
        }
        this.router.navigate(['/dashboard']);
// More lines which handles the error section

Меню приложения html

 <div *ngIf="m.submenus?.length > 0" class="collapse" id="{{ m.name }}" aria-expanded="false">
             <ul class="flex-column pl-2 nav submenu-dark">
                <li *ngFor="let secondlevel of m.submenus" class="nav-item">
                   <a class="nav-link collapsed text-truncate" routerLink="{{ secondlevel.slug }}"><span>{{ secondlevel.name }}</span></a>

                </li>
             </ul>
      </div>

В настоящее время routerlink работает после принудительного перенаправления вместо угловой навигации по маршрутизатору. как это исправить?


angular8 angular-routerlink
person Krishnadas PC    schedule 24.02.2020    source источник

Ответы (2)


arrow_upward
0
arrow_downward

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

person vivek bharda    schedule 25.02.2020

arrow_upward
0
arrow_downward

Исправлена ​​проблема со следующими изменениями в app.component

<app-header></app-header>
<div *ngIf="router.url !== '/login'; else loginTemplateName" id="wrapper" class="toggled container-margin-fix">
    <app-menu></app-menu>
    <router-outlet></router-outlet> 
    <app-footer></app-footer> 
</div> 
<ng-template #loginTemplateName>
    <app-menu></app-menu>
    <router-outlet></router-outlet> 
    <app-footer></app-footer> 
</ng-template>

Внутри app-menu и app-footer есть *ngIf, проверяющий, не является ли это URL-адресом для входа. Нам нужно добавить контейнер app-menu в обоих случаях в app.component.html тогда только он будет работать, хоть он и спрятан внутри app-menu. Раньше это было просто <router-outlet> только для маршрута входа в aapp.component.html

person Krishnadas PC    schedule 25.02.2020