Угловая страница с 6 повторениями в URL и дочерние маршруты не работают - PullRequest
Новая
       6

Угловая страница с 6 повторениями в URL и дочерние маршруты не работают

0 голосов
/ 17 декабря 2018

Когда я обновляю страницу, страница добавляет http://localhost:4200/login -> http://localhost:4200/login/login

и когда я добавляю прямой путь к http://localhost:4200/dashboard Она должна перенаправить на свой дочерний маршрут, но вместо этого она перенаправляется на http://localhost:4200/dashboard/login.

У меня есть угловая структура, подобная этой

Я создал компонент макета, где я выводю маршрутизатор <router-outlet></router-outlet> родительские компоненты, т. Е. Логин, запрос доступа, панель мониторинга

и панель мониторинга.я включил еще один <router-outlet></router-outlet> для дочерних путей маршрутизатора

Мои маршруты для этой структуры следующие: 

const routes: Routes = [
  {path:'',redirectTo:'login',pathMatch:'full'},
  {path:'login',component:LoginComponent},
  {path:'request-access',component:RequestAccessComponent},
  {path:'dashboard',component:NavigationComponent,
    children:[
      {path:'',redirectTo:'admin',pathMatch:'full'},
      {path:'admin',component:AdminLandingComponent},
      {path:'user-list',component:UserListComponent},
      {path:'new-request',component:NewRequestComponent},
      {path:'payments',component:PaymentsComponent}
    ]
  }
];

эта проблема возникла, когда я добавил этот код в login.component.ts вперенаправить на панель приборов.после удаления кода, имеющего ту же проблему 

loginUser(username:string,password:string){
    console.log(username,password);
    if(username ===""){
      this.erroMessage = "Please enter username."
    }else if(password === ""){
      this.erroMessage = "Please enter password."
    }else{
      if(username === "admin" && password === "admin"){
        localStorage.setItem('isLoggedIn',"true");
        localStorage.setItem('name',"admin");
        this.router.navigate(['/admin']);
      }else{
        this.erroMessage = "Wrong username password. Please try again later"
      }
    }
  }

Я попытался очистить локальное хранилище, используя localStorage.clear(); , но проблема все еще возникает

ссылается на это изображение, если я что-то не так делаю в структуре папок enter image description here

Я уже упоминал этот вопрос и документация angularjs Обновление Angular4 повторяет страницу в URL

1 Ответ

0 голосов
/ 17 декабря 2018

Если вы используете два модуля для определения ROUTES, попробуйте изменить:

В app.module.ts 

RouterModule.forRoot([
      { path: '', redirectTo: '/login', pathMatch: 'full' },
      { path: 'login', component: LoginComponent },

      { path: 'dashboard', component: DashboardComponent },
      // other ROUTES
      { path: '**', component: Your_page_not_found_component}
])

В app.component.html: 

<router-outlet></router-outlet>

В компоненте входа в систему: 

import { Router } from '@angular/router';

constructor(private router: Router){}

После успешного входа в систему этим методом: 

this.router.navigate(['dashboard']);
...