在 Angular 7 中,路由代码发生了一些变化,旧的 Angular 路由代码可能无法正常工作。以下是一个包含代码示例的解决方法:
首先,确保你已经升级到 Angular 7 版本。
在你的 Angular 7 项目中,打开 app-routing.module.ts
文件。
在该文件中,你可能会看到旧的路由代码,类似于以下示例:
import { Routes, RouterModule } from '@angular/router';
import { HomeComponent } from './home.component';
import { AboutComponent } from './about.component';
const appRoutes: Routes = [
{ path: '', component: HomeComponent },
{ path: 'about', component: AboutComponent },
];
export const routing = RouterModule.forRoot(appRoutes);
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { HomeComponent } from './home.component';
import { AboutComponent } from './about.component';
const routes: Routes = [
{ path: '', component: HomeComponent },
{ path: 'about', component: AboutComponent },
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
注意:在 Angular 7 中,RouterModule.forRoot()
已经变成了一个方法。同时,你还需要使用 imports
和 exports
来导入和导出路由模块。
通过以上步骤,你应该能够解决旧的 Angular 路由代码无法工作的问题,并成功迁移到 Angular 7 的新的路由代码。