Importieren eine Reihe von Modulen im Angular

Question

Ich baue eine app mit kantigem 4 und Angular Material, jede Werkstoff Richtlinie mich sein Modul separat zu importieren erfordert ..

Zum Beispiel, ich bin der Aufbau eine Navigationsleiste, dies ist, wie die nav.module.ts beginnt aussehen:

import {NgModule} from '@angular/core'; 
import {CommonModule} from '@angular/common'; 
import {NavComponent} from './nav.component'; 
import { AngularFontAwesomeModule } from 'angular-font-awesome/angular-font-awesome'; 
import { MdInputModule } from '@angular/material'; 
import { MdMenuModule } from '@angular/material'; 
import {MdButtonModule} from '@angular/material'; 
import { FlexLayoutModule } from '@angular/flex-layout'; 
import {HttpClientModule, HttpClient} from '@angular/common/http'; 
import {TranslateModule, TranslateLoader} from '@ngx-translate/core'; 
import {TranslateHttpLoader} from '@ngx-translate/http-loader'; 

@NgModule({ 
imports: [ 
    CommonModule, 
    AngularFontAwesomeModule, 
    MdInputModule, 
    MdMenuModule, 
    MdButtonModule, 
    FlexLayoutModule, 
    HttpClientModule, 

    .... 

Es gibt nur 3 Material Module jetzt, muß ich später mehr hinzuzufügen und außer Material, gibt es auch andere Module, die importiert werden müssen ...

Gerade angefangen, von zu bewegen AngularJS to Angular4 es fühlt sich an, als würde ich etwas falsch machen ... Gibt es eine bessere Möglichkeit, alle Module zu importieren? Ist mein Ansatz zur Strukturierung der App falsch?

Answer 1

Sie können ein "freigegebenes" Modul erstellen, das jedes der benötigten Material Design-Module exportiert. Dann können Sie einfach das "geteilte" Modul in Ihre anderen Module importieren, die sie benötigen. Hier

ein Beispiel:

In diesem Bild, das ich ein gemeinsames Modul haben, das CommonModule und FormsModule exportiert. Das ProductModule importiert dann das SharedModule, um alle von CommonModule und FormsModule bereitgestellten Funktionen zu erhalten.

Ich habe ein YouTube-Video dazu hier: https://www.youtube.com/watch?v=ntJ-P-Cvo7o