路由器链路在Ionic中不执行

l7wslrjt  于 2023-04-27  发布在  Ionic
关注(0)|答案(1)|浏览(133)

我试图在ionic7中创建一个简单的路由。我使用angular。实际上它应该像这样工作,但在最新的ionic7补丁之后它不再工作了。我想进入网络页面。我的错误看起来像这样

re.mjs:8416 ERROR Error: Uncaught (in promise): Error: NG04002: Cannot match any routes. URL Segment: 'home/network'
Error: NG04002: Cannot match any routes. URL Segment: 'home/network'

app.routes.ts:

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

export const routes: Routes = [
  {
    path: 'home',
    loadComponent: () => import('./home/home.page').then((m) => m.HomePage),
  },
  {
    path: '',
    redirectTo: 'home',
    pathMatch: 'full',
  },
  {
    path: 'network',
    loadComponent: () => import('./home/network/network.page').then( m => m.NetworkPage)
  },
];

main.ts

import { enableProdMode, importProvidersFrom } from '@angular/core';
import { BrowserModule, bootstrapApplication } from '@angular/platform-browser';
import { RouteReuseStrategy, provideRouter } from '@angular/router';
import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { HttpClientModule} from '@angular/common/http';

import { routes } from './app/app.routes';
import { AppComponent } from './app/app.component';
import { environment } from './environments/environment';
import { CommonModule,} from '@angular/common';

if (environment.production) {
  enableProdMode();
}

bootstrapApplication(AppComponent, {
  providers: [
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy,},
    importProvidersFrom(IonicModule.forRoot({}),HttpClientModule,CommonModule,BrowserModule,),
    provideRouter(routes),
  ],
});

home.page.html:

<ion-header [translucent]="true">
  <ion-toolbar>
    <ion-title>
    </ion-title>

  </ion-toolbar>
</ion-header>

<ion-content [fullscreen]="true">

  <ion-row>
    <ion-col size="6">
      <ion-card color="primary" [routerLink]="['network']">
        <ion-card-header class="ion-text-center">Network</ion-card-header>
      </ion-card>
    </ion-col>
  </ion-row>

</ion-content>

相关问题