Angular 2 \ TypeScript中export关键字的确切含义是什么? [英] What is the exact meaning of export keyword in Angular 2\TypeScript?

问题描述

我在 Angular 2 中是个新手.我正在研究如何将模块创建到Angular应用中，并且我对以下与我正在关注的教程有关的疑问.

I am pretty new in Angular 2. I am studying how to create modules into an Angular app and I have the following doubt related a tutorial that I am following.

我的怀疑与路由有关.

因此在我的示例中，定义了此 AuthModule 模块:

So in my example there is defined this AuthModule module:

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配置类:

and I have the related rotues configuration class defined:

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 关键字意味着可以将该类相关的内容导出并在其他地方使用(在这种情况下，我认为是将 imports AuthModule 类).

So I think that the export keyword means that the content related to this class can be exported and used somewhere else (in this case I think into the imports array of the AuthModule class).

是吗?还是我错过了什么? 出口声明的确切含义是什么?

Is it? Or am I missing something? What it the exact meaning of the export statment?

我不知道它是否与Angular有关，或更笼统地说与TypeScript有关(因为在这里我找到了

I am not understanding if it is something related to Angular or more generally to TypeScript (because here I found https://www.typescriptlang.org/docs/handbook/modules.html). So it seems to me that this module concept is not directly bounded to Angular 2 framework but is a TypeScript concept to subdivide our code in a smart way (then Angular 2 can use this kind of feature of the language).

是还是我缺少什么?

推荐答案

角度导入/导出和TypeScript导入/导出是两个不同的概念.

Angular imports/exports and TypeScript imports/exports are two different concepts.

TypeScript导入/导出在语言级别起作用，以明确说明 使用的标识符完全引用.这与Angular完全无关.

TypeScript imports/exports work at language level to make it clear what a used identifier references exactly. This is entirely unrelated to Angular.

因此，如果您使用FormsModule，则不会有任何歧义，这就是FormsModule的含义.如果您的代码或任何依赖项中有多个FormsModule，那么您需要通过导入使其含义清楚.您不能毫无歧义地从不同的位置导入2个FormsModule(例如，在导入中使用as foo，然后使用foo.FormsModule进行引用).

So, if you use FormsModule there can't be any ambiguity, what FormsModule is meant. If there is more than one FormsModule in your code or any of your dependencies, then you need to make it clear with imports which one is meant. You can't import 2 FormsModule from different locations without disambiguation (for example using as foo in the import and then reference it using foo.FormsModule).

这样，您可以使用来自任意第三方库的代码，并避免名称冲突.

This way you can use code from arbitrary 3rd-party libraries and avoid name collisions.

角度导入/导出用于使一个模块的内容可用于另一模块.

Angular imports/exports are used to make the content of one module available to be used in another module.

您的

imports: [
    FormsModule,
    AuthRoutingModule
  ]

允许您使用AuthModule中的FormsModule和AuthRoutingModule中的指令，并在AppModule范围或封闭的延迟加载根范围中注册这些模块提供的服务.

Allows you to use the directives from FormsModule and AuthRoutingModule in AuthModule and registers the services provided by these modules in the AppModule scope or the closed lazy-loaded root scope.

如果在TypeScript代码中引用任何Angulars指令或服务，则还需要添加TypeScript导入.在FormsModule和AuthRoutingModule上方，需要使用TypeScript导入进行导入，以使Angular imports: [...]正常工作.

If you reference any of Angulars directives or services in TypeScript code, you also need to add TypeScript imports. Above FormsModule and AuthRoutingModule need to be imported with TypeScript imports, to make the Angular imports: [...] work.

例如

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

仅在当前模块的imports: [ ... ]中列出了FormsModule时有效.

works only if FormsModule is listed in imports: [ ... ] of your current module.

因为没有TypeScript代码，所以不需要导入TypeScript.

There is no TypeScript import required, because there is no TypeScript code.

这篇关于Angular 2 \ TypeScript中export关键字的确切含义是什么?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！