错误:模块'AppRoutingModule'递归导出模块'AppRoutingModule'

问题描述 投票:2回答:3

我正在构建一个角度应用程序,在导入并实现“路由模块”之前,一切工作正常。

错误消息

enter image description here

我经历了,不认为以下是可能的问题:

  • 语法错误,例如多个逗号等
  • 递归调用
  • 路由器模块的代码:

import { NgModule } from '@angular/core';
import { Routes , RouterModule } from '@angular/router';
import { RecipesComponent } from './recipes/recipes.component';
import { ShoppingListComponent } from './shopping-list/shopping-list.component';

const appRoutes: Routes = [
	{path: 'recipes', component: RecipesComponent},
	{path: 'shopping-list', component: ShoppingListComponent},
  	{ path: '', redirectTo: 'recipes', pathMatch: 'full'},
  	{ path: '**', redirectTo: '/not-found'},
]

@NgModule({
	imports: [
		RouterModule.forRoot(appRoutes),
	],
	exports: [AppRoutingModule]
})

export class AppRoutingModule{

}

根组件代码:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

import { AppComponent } from './app.component';
import { HeaderComponent } from './header/header.component';
import { RecipesComponent } from './recipes/recipes.component';
import { RecipeListComponent } from './recipes/recipe-list/recipe-list.component';
import { RecipeDetailComponent } from './recipes/recipe-detail/recipe-detail.component';
import { RecipeItemComponent } from './recipes/recipe-list/recipe-item/recipe-item.component';
import { ShoppingListComponent } from './shopping-list/shopping-list.component';
import { ShoppingEditComponent } from './shopping-list/shopping-edit/shopping-edit.component';
import { DropdownDirective } from './shared/dropdown.directive';
import { ShoppingListService } from './shopping-list/shopping-list.service';
import { AppRoutingModule } from './app-routing.module';

@NgModule({
  declarations: [
    AppComponent,
    HeaderComponent,
    RecipesComponent,
    RecipeListComponent,
    RecipeDetailComponent,
    RecipeItemComponent,
    ShoppingListComponent,
    ShoppingEditComponent,
    DropdownDirective
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    AppRoutingModule
  ],
  providers: [ShoppingListService],
  bootstrap: [AppComponent]
})
export class AppModule { }

我正在构建一个角度应用程序,直到我导入并实现了“路由模块”错误消息,并且一切都不可能完成之后,一切工作都很好...

angular angular-routing angular-router
3个回答
4
投票
您导出的模块错误。将exports: [AppRoutingModule]更改为exports: [RouterModule]

2
投票
尝试更改:

0
投票
导出RouterModule而不是AppRoutingModule。
© www.soinside.com 2019 - 2024. All rights reserved.