Znajdź zawartość
Wyświetlanie wyników dla tagów 'router' .
-
Angular + Ionic = dziwne zachowanie Router-a
Konrad-GM opublikował(a) temat w HTML, PHP, mySQL, JavaScript
Cześć, ktoś się może zajmuje tutaj Angular-em? Bo prosiłbym o pomoc kogoś, kto miał jakieś doświadczenie z Router-em. Otóż Angular dziwnie się zachowuje, jak buduje routing aplikacji, chodzi dokładniej o child Routers w modułach. Podzieliłem podstrony aplikacji na moduły, które importują routing poprzez RouterModule.forChild i przekierowanie z modułu sessions.module na list.page działa, ale gdy przekierowuję na view.page z modułu sessions.module, to kompletnie się psuje routing i przekierowuje mnie znowu na list.page z dość dziwnym linkiem. Struktura aplikacji wygląda tak: src\app |- app-routing-module |- \home |- home.page |- \intro |- intro.page |- \sessions |- sessions.module |- \list |- list.page |- \view |- view.page |- \shared |- shared.module Kod głównego modułu app-routing.module: import { NgModule } from '@angular/core'; import { Routes, RouterModule } from '@angular/router'; const routes: Routes = [ { path: '', redirectTo: 'intro', pathMatch: 'full' }, { path: 'home', loadChildren: './home/home.module#HomePageModule' }, { path: 'intro', loadChildren: './intro/intro.module#IntroPageModule' }, { path: 'sessions', loadChildren: './sessions/sessions.module#SessionsModule' } ]; @NgModule({ imports: [RouterModule.forRoot(routes)], exports: [RouterModule] }) export class AppRoutingModule {} Kod modułu session.module wygląda tak: import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { Routes, RouterModule } from '@angular/router'; const routes: Routes = [ { path: '', redirectTo: 'list', pathMatch: 'full' }, { path: 'list', loadChildren: './list/list.module#ListPageModule' }, { path: 'view', loadChildren: './view/view.module#ViewPageModule' } ]; @NgModule({ imports: [ CommonModule, RouterModule.forChild(routes), ] }) export class SessionsModule {} Przekierowuję na stronę view.page dyrektywą: [routerLink]="['/sessions', 'view']" Link przed przekierowaniem wygląda tak: http://localhost:8100/sessions/list Po kliknięciu na link, przekierowuje mnie do tej samej strony list.page, ale link wygląda już tak: http://localhost:8100/sessions/view/list Zauważyłem, że jak usunę kod odpowiedzialny za przekierowanie w module sessions.module: const routes: Routes = [ // { // path: '', // redirectTo: 'list', // pathMatch: 'full' // }, { path: 'list', loadChildren: './list/list.module#ListPageModule' }, { path: 'view', loadChildren: './view/view.module#ViewPageModule' } ]; To wtedy działa jak powinno, ale nie przekierowuje mnie na list.page jak przejdę na link /sessions (trzeba przekierowywać bezpośrednio na /sessions/list) Może ktoś ma jakiś pomysł, dlaczego w taki właśnie sposób zachowuje się Angular?