在Angular 7中,如果通配符路由不起作用,可能是由于以下原因:
const routes: Routes = [
{ path: 'home', component: HomeComponent },
{ path: 'about', component: AboutComponent },
// 其他路由配置...
{ path: '**', component: NotFoundComponent } // 通配符路由
];
const routes: Routes = [
{ path: 'home', component: HomeComponent },
{ path: 'about', component: AboutComponent },
// 其他路由配置...
{ path: 'lazy', loadChildren: './lazy/lazy.module#LazyModule' }, // 惰性加载模块
{ path: '**', component: NotFoundComponent } // 通配符路由
];
RouterModule
和Routes
。import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouterModule, Routes } from '@angular/router'; // 导入RouterModule和Routes
import { AppComponent } from './app.component';
import { HomeComponent } from './home.component';
import { AboutComponent } from './about.component';
import { NotFoundComponent } from './not-found.component';
const routes: Routes = [
{ path: 'home', component: HomeComponent },
{ path: 'about', component: AboutComponent },
// 其他路由配置...
{ path: '**', component: NotFoundComponent } // 通配符路由
];
@NgModule({
declarations: [
AppComponent,
HomeComponent,
AboutComponent,
NotFoundComponent
],
imports: [
BrowserModule,
RouterModule.forRoot(routes) // 导入RouterModule.forRoot()方法并传入路由配置
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
,以便正确渲染子组件。
My App
如果这些解决方法都不能解决问题,可以提供更多的代码示例和错误信息,以便更好地帮助你解决问题。