Issue
i'm trying to create a simple route in ionic7. i'm using angular. actually it should work like this, but after the latest ionic7 patch it doesn't work anymore. i want to get to the network page. my error looks like this
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>
Solution
Try this
[routerLink]="['/network']"
Answered By - mani kandan
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.