Was genau bedeutet Exportschlüsselwort in Angular 2 \ TypeScript?

Question

Ich bin ziemlich neu in Angular 2. Ich lerne, wie man Module in eine Angular-App einbaut und ich habe die folgenden Zweifel bezüglich eines Tutorials, das ich befolge.

Meine Zweifel beziehen sich auf das Routing.

So in meinem Beispiel ist dieses AuthModule Modul definiert:

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 {} 

und ich habe die rotues Konfigurationsklasse im Zusammenhang definiert:

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 { 

} 

Deshalb denke ich, dass das Export Stichwort bedeutet, dass der Inhalt dieser Klasse exportiert und woanders verwendet werden kann (in diesem Fall denke ich an die Importe Array der AuthModule Klasse).

Ist es? Oder fehlt mir etwas? Was ist die genaue Bedeutung der Export Statment?

Ich verstehe nicht, wenn es etwas mit Angular oder allgemeiner mit TypeScript verwandt ist (weil ich hier https://www.typescriptlang.org/docs/handbook/modules.html fand). So scheint mir, dass dieses Modulkonzept nicht direkt an Angular 2 Framework gebunden ist, sondern ein TypeScript-Konzept ist, um unseren Code auf intelligente Weise zu unterteilen (dann kann Angular 2 diese Art von Merkmal der Sprache verwenden).

Ist es oder fehlt mir etwas?

Answer 1

Angular Import/Export und Typoskript Import/Export sind zwei unterschiedliche Konzepte.

TypScript importiert/exportiert arbeiten auf Sprachniveau, um klar zu machen, was ein verwendeter Bezeichner genau verweist. Dies steht in keinem Zusammenhang mit Angular.

Also, wenn Sie FormsModule verwenden, kann es keine Zweideutigkeit geben, was FormsModule gemeint ist. Wenn es mehr als eine FormsModule in Ihrem Code oder einer Ihrer Abhängigkeiten gibt, dann müssen Sie mit Importe klar machen, welche gemeint ist. Sie können 2 FormsModule nicht von verschiedenen Stellen ohne Disambiguierung importieren (z. B. mit as foo im Import und dann mit foo.FormsModule).

Auf diese Weise können Sie Code aus beliebigen Bibliotheken von Drittanbietern verwenden und Namenskonflikte vermeiden.

Eckige Importe/Exporte werden verwendet, um den Inhalt eines Moduls für die Verwendung in einem anderen Modul verfügbar zu machen.

Ihre

Importe: [ FormsModule, AuthRoutingModule ]

Hier können Sie die Richtlinien von FormsModule und AuthRoutingModule in AuthModule verwenden, und registriert die von diesen Modulen im AppModule Umfang Leistungen oder geschlossen lazy-loaded root scope.

Wenn Sie in TypScript-Code auf eine der Angular-Anweisungen oder -Dienste verweisen, müssen Sie auch TypeScript-Importe hinzufügen. Über FormsModule und AuthRoutingModule müssen mit TypeScript-Importen importiert werden, damit der Angular imports: [...] funktioniert.

Zum Beispiel wie

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

funktioniert nur, wenn FormsModule in imports: [ ... ] des aktuellen Moduls aufgeführt ist.

Es ist kein TypScript-Import erforderlich, da kein TypeScript-Code vorhanden ist.

Answer 2

Ja, Sie sind direkt mit Export Schlüsselwort vor Ihrer Typoskript Klasse können Sie diese Klasse verwenden, woanders .. in Ihrem Projekt