通过在下面添加条目
,在app.module.ts
中导入模块
@NgModule({
declarations: [
AppComponent,
HomeComponent,
DirectoryComponent,
FilterPipe,
LoggingService
],
imports: [
FormsModule,
BrowserModule,
HttpClientModule,
routing
],
providers: [],
bootstrap: [AppComponent]
})
但RouterModule
直接用于../src/app/app.routes.ts
,如下所示,
import {Routes, RouterModule} from "@angular/router";
export const routes:Routes = [
/* Each route will be an object {}*/
{path: 'directory', component: DirectoryComponent},
{path: '', component: HomeComponent}
];
export const routing: ModuleWithProviders = RouterModule.forRoot(routes);
RouterModule
中没有@NgModule(imports: [..])
条目。
1) 导入角度模块有不同的方法吗?
2) 角度模块的导入是否与打字稿模块的导入不同?
答案 0 :(得分:5)
在您的routes.ts
中,您正在创建名为routes
的常量,为其指定RouterModule
并将其导出。
在您的应用中,您正在导入routes
常量,这只是对模块的引用,就像其他任何一样:
@NgModule(
.... imports: [
routing, // here you are using the const
],
....
)
你要在这一行上分配它:
export const routing: ModuleWithProviders = RouterModule.forRoot(routes);
您可以改为使用导出的routes
并在app.module中使用它:
@NgModule(
.... imports: [
RouterModule.forRoot(routes),
],
....
第一种是在使用之前将它分配给变量(well const)。
Typescript modules与Angular模块不同。 Typescript模块允许您在打字稿文件之间共享打字稿对象。你可以在任何地方使用它们,即使是非角度打字稿。它们是import { something } from 'myfile.ts'
,它被转换为JavaScript ES5 require语句,就像ES6导入一样。根据我的经验,没有多少人将这些称为模块。
Angular modules是角度组件,服务,指令和管道等的模块化块,因此编译器知道如何处理它们,并且您可以轻松地从它们组成角度应用程序。如果有人在谈论角度和模块,那么他们可能会谈论这些因为打字稿模块是如此根本 - 每个打字稿文件都会在顶部有多个导入。
答案 1 :(得分:2)
有一个条目,您只需将其命名为routing
const
。
所以在您的情况下,routing
实际上是RouterModule.forRoot(routes);
,这意味着它是RouterModule.
我认为棱角分明的团队在这里很好地解释了https://angular.io/guide/router
并且没有打字稿模块。只有角度模块。在您的情况下,您将角度模块分配给名为const
的{{1}},并将其导出。