Angular 2 \\ TypeScript中export關鍵字的確切含義是什么？

Question

我在Angular 2中還很陌生 。 我正在研究如何在Angular應用程序中創建模塊，並且我對以下與我正在關注的教程有關的疑問有所疑問。

我的懷疑與路由有關。

因此，在我的示例中定義了AuthModule模塊：

import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';

import { SigninComponent } from './signin/signin.component';
import { SignupComponent } from './signup/signup.component';
import { AuthRoutingModule } from './auth-routing.module';

@NgModule({
  // Components and directives used by the module:
  declarations: [
    SigninComponent,
    SignupComponent
  ],
  // Import modules used by this features module:
  imports: [
    FormsModule,
    AuthRoutingModule
  ]
})
export class AuthModule {}

並且我定義了相關的rotues配置類：

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { ShoppingListComponent } from './shopping-list/shopping-list.component';

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

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

}

因此，我認為export關鍵字意味着可以將該類相關的內容導出並在其他地方使用（在這種情況下，我認為是AuthModule類的imports數組）。

是嗎？ 還是我錯過了什么？ 出口聲明的確切含義是什么？

我不了解它是否與Angular有關，或更籠統地說與TypeScript有關（因為在這里我找到了https://www.typescriptlang.org/docs/handbook/modules.html ）。 因此在我看來，這個模塊概念並不直接綁定到Angular 2框架，而是一個TypeScript概念，可以用一種靈巧的方式細分我們的代碼（然后Angular 2可以使用這種語言的功能）。

是我還是缺少什​​么？

Answer 1

Angular導入/導出和TypeScript導入/導出是兩個不同的概念。

TypeScript導入/導出在語言級別進行工作，以使所使用的標識符准確地引用什么。 這與Angular完全無關。

因此，如果使用FormsModule ，就不會有任何歧義，這就是FormsModule的意思。 如果您的代碼或任何依賴FormsModule中有多個FormsModule ，則需要通過導入使其含義清楚。 您不能毫無歧義地從不同的位置導入2個FormsModule （例如，在導入中使用as foo ，然后使用foo.FormsModule引用它）。

這樣，您可以使用來自任意第三方庫的代碼，並避免名稱沖突。

角導入/導出用於使一個模塊的內容可用於另一模塊。

你的

導入：[FormsModule，AuthRoutingModule]

允許您使用從指令FormsModule和AuthRoutingModule在AuthModule並注冊通過在這些模塊提供的服務AppModule范圍或閉合延遲加載根范圍。

如果您在TypeScript代碼中引用了任何Angulars指令或服務，則還需要添加TypeScript導入。 上面的FormsModule和AuthRoutingModule需要與TypeScript導入一起導入，以進行Angular imports: [...]

例如像

<form #f="ngForm">
  <input type="text">
</form>

僅當FormsModule列在當前模塊的imports: [ ... ]中時有效。

由於沒有TypeScript代碼，因此不需要導入TypeScript。

Answer 2

是的，您可以通過在typescript類之前使用export關鍵字來正確使用，您可以在項目的其他地方使用該類。