Как исправить ошибку «Ошибка: невозможно сопоставить маршруты» при переходе на вкладки после входа в систему? - PullRequest
0 голосов
/ 11 февраля 2019

Я пытаюсь сделать приложение доступным только после входа в систему с использованием Ionic 4 (4.10.2 с Angular 7.3.1).После выполнения этого урока (https://devdactic.com/ionic-4-login-angular/) я не могу перейти к той части моего приложения, которая использует ion-tabs. Chrome всегда показывает это в журнале консоли: «Uncaught (in обещание): Ошибка: невозможно сопоставить ни один маршрут». URL Segment: 'members / tab1' "

Приложение будет использовать Laravel-backend, и я хочу использовать токены для защиты соединения. Но пока я использую только фиктивный токен из учебника.Когда я пытаюсь связать что-то отличное от вкладок после входа в систему, он работает просто отлично, но это не решает мою проблему.

Маршрутизация в app-routing.module.ts:

const routes: Routes = [
  { path: '', redirectTo: 'login', pathMatch: 'full' },
  { path: 'login', loadChildren: './public/login/login.module#LoginPageModule' },
  { path: 'register', loadChildren: './public/register/register.module#RegisterPageModule' },
  {
    path: 'members',
    canActivate: [AuthGuard],
    loadChildren: './members/member-routing.module#MemberRoutingModule'
  },

];
@NgModule({
  imports: [
    RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
  ],
  exports: [RouterModule]
})

member-routing.module.ts:

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

const routes: Routes = [
  { path: 'tabs', loadChildren: './tabs/tabs.module#TabsPageModule' },
  { path: 'message', loadChildren: './message/message.module#MessagePageModule' },
  { path: 'playerview', loadChildren: './playerview/playerview.module#PlayerviewPageModule' },
  { path: 'playerlist', loadChildren: './playerlist/playerlist.module#PlayerlistPageModule' },
  { path: 'teamview', loadChildren: './teamview/teamview.module#TeamviewPageModule' },
  { path: 'teamlist', loadChildren: './teamlist/teamlist.module#TeamlistPageModule' },
  { path: 'teammanagement', loadChildren: './teammanagement/teammanagement.module#TeammanagementPageModule' }
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class MemberRoutingModule { }

InitialiseApp от app.component.ts:

initializeApp() {
  this.platform.ready().then(() => {
    this.statusBar.styleDefault();
    this.splashScreen.hide();
    this.authenticationService.authenticationState.subscribe(state => {
      if (state) {
        this.router.navigate(['members', 'tabs']);
      } else {
        this.router.navigate(['login']);
      }
    });
  });
}

Маршрутизация в tabs.router.module.ts:

const routes: Routes = [
  {
    path: 'tabs',
    canActivate: [AuthGuard],
    component: TabsPage,
    children: [
      {
        path: 'tab1',
        children: [
          {
            path: '',
            canActivate: [AuthGuard],
            loadChildren: '../tab1/tab1.module#Tab1PageModule'
          }
        ]
      },
      {
        path: 'tab2',
        children: [
          {
            path: '',
            canActivate: [AuthGuard],
            loadChildren: '../tab2/tab2.module#Tab2PageModule'
          }
        ]
      },
      {
        path: 'tab3',
        children: [
          {
            path: '',
            canActivate: [AuthGuard],
            loadChildren: '../tab3/tab3.module#Tab3PageModule'
          }
        ]
      },
      {
        path: 'tab4',
        children: [
          {
            path: '',
            canActivate: [AuthGuard],
            loadChildren: '../tab4/tab4.module#Tab4PageModule'
          }
        ]
      },
      {
        path: '',
        redirectTo: '/tabs/tab1',
        pathMatch: 'full'
      }
    ]
  },
  {
    path: '',
    canActivate: [AuthGuard],
    redirectTo: '/members/tabs/tab1',
    pathMatch: 'full'
  }
];

Моя пробная кнопка входа в систему в login.page.html:

<ion-button (click)="login()" expand="block"  routerLink="../members/tab1">Login</ion-button>

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

Если мне нужно добавить auth.guard.ts или anytХинг, пожалуйста, скажите мне.Заранее спасибо!

1 Ответ

0 голосов
/ 11 февраля 2019

Я думаю, вам нужно изменить ссылку в вашем routerLink на ../members/tabs/tab1.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...