Angular - приложение не маршрутизируется должным образом при обновлении страницы вручную - PullRequest
0 голосов
/ 20 марта 2019

В моем приложении Angular я настроил маршрутизацию app.routing.ts, как показано ниже:

const routes: Routes = [{
    path: '',
    redirectTo: '/login',
    pathMatch: 'full',
    canActivate: [LoginGuard]
},
{
    path: 'login',
    component: LoginComponent,
    canActivate: [LoginGuard]
},
{
    path: '',
    component: AdminLayoutComponent,
    canActivate: [AuthGuardService],
    data: {
        expectedRole: 'Admin'
    },
    children: [{
        path: '',
        loadChildren: './layouts/admin-layout/admin-layout.module#AdminLayoutModule'
    }]
},
{
    path: 'customer_dashboard',
    component: CustomerLayoutComponent,
    canActivate: [AuthGuardService],
    data: {
        expectedRole: 'Customer'
    },
    children: [{
        path: '',
        loadChildren: './layouts/customer-layout/customer-layout.module#CustomerLayoutModule'
    }]
},
{
    path: '',
    component: MobiLayoutComponent,
    canActivate: [AuthGuardService],
    data: {
        expectedRole: 'Mobilink'
    },
    children: [{
        path: '',
        loadChildren: './layouts/mobi-layout/mobi-layout.module#MobiLayoutModule'

    }]
},

{
    path: '**',
    redirectTo: 'login',
    pathMatch: 'full'
}
];

@NgModule({
imports: [
    CommonModule,
    BrowserModule,
    NgxUiLoaderModule.forRoot(ngxUiLoaderConfig),
    RouterModule.forRoot(routes),
],
exports: [],
})
export class AppRoutingModule {}

это мой логин аутентификации сторожа

import { Injectable } from '@angular/core';
import { Router, CanActivate } from '@angular/router';
import { LoginAuthenticateService } from './login-authenticate.service';
import * as decode from 'jwt-decode';

@Injectable()
export class LoginAuthenticateGuardService implements CanActivate {

constructor(public auth:LoginAuthenticateService,public router:Router) {
}

canActivate():boolean{
if (this.auth.isAuthenticated()) {
  const token = localStorage.getItem('token');
  const tokenPayload = decode(token);
  const user_role=tokenPayload['role'].toString();
  if(user_role=='Admin')
  {
   this.router.navigate(['dashboard']);
   return false;
  }
  else if(user_role=='Customer')
  {
    this.router.navigate(['customer_dashboard']);
    return false;
  }
  else if(user_role=='Mobilink')
  {
    this.router.navigate(['mobilink_dashboard']);
    return false;
  }
}
return true;

}

}

Все работало нормально, за исключением одной странной проблемы, т. Е. Когда я нажимал на ссылку localhost:4200, браузер направлял меня к locahost: 4200 / login, что нормально, но всякий раз, когда я вручную обновлял страницу localhost:4200/login, Angular направлял меня к localhot:4200/login/login, что странно, и всякий раз, когда я вручную обновляю страницу localhost: 4200 / login / login, я ничего не получаю.

...