Angular2 So bereinigen Sie das AppModule

7

Ich habe die Tutorials online verwendet und eine 'OK' SPA-Dateneingabeanwendung erstellt.

Ich habe es mit meiner WEB-API verbinden, aber ich habe nur ein Modell aufgebaut und schon hat mein AppModule einige Zeilen still.

Ich denke nach vorne und benutze die aktuelle Methode. Ich denke, das AppModule wird eine verrückte Größe haben, wenn ich damit fertig bin, schwer zu lesen und möglicherweise noch schwieriger zu debuggen.

Habe ich vielleicht den Punkt übersehen, wie man eine größere Angular2-Anwendung strukturiert?

Ich habe Mühe, online ein Tutorial / Projekt zu finden, das größer als eine Komponente ist.

Unten ist meine app.module.ts und Ordnerstruktur.

Ich teile mein CashMovement , ListComponent und DataService , was ich für eine gute Praxis halte, aber füge weitere 10 verschiedene Datendienste und Listen hinzu und das app.module wird langwierig sein.

Bevor ich fortfahre, hat jemand bitte eine Lektüre, auf die sie mich hinweisen können, oder einen Rat, den ich verstehe, ist subjektiv für die persönliche Meinung.

app.modul

%Vor%

Ordnerstruktur

    
Glenn Sampson 06.10.2016, 23:05
quelle

1 Antwort

23

Sie müssen lernen, Module zu verwenden.

Normalerweise zerlege ich die Module in diese Typen

  • Layoutmodule
  • Feature-Module
  • Kernmodul (nur 1)
  • Geteiltes Modul (nur 1)
  • App-Modul (nur 1)

Layout-Modul dient zum Auslegen der App. Zum Beispiel ein Topbar-Modul, ein Seitenmenu-Modul, ein Fußzeilenmodul und ein Hauptinhaltsmodul.

Feature-Modul . Was ist das genau? Es gibt wirklich keine klare Definition, aber welcher Funktionsbereich auch immer in Modul enthalten sein mag, Sie könnten es genauso gut tun. Sie importieren diese Feature-Module in Ihre Layout-Module, da die Features die verschiedenen Layout-Komponenten bilden.

Kernmodul . Hier exportieren Sie Ihre Layout-Module und alle Ihre Core-Services (Singleton). Sie müssen die Module nur exportieren (und nicht importieren), da nichts im Kernmodul diese Layoutmodule tatsächlich verwendet. Sie exportieren sie einfach, damit das App-Modul sie verwenden kann. Das Kernmodul wird nur in das App-Modul

importiert

Geteiltes Modul . Hier deklarieren Sie alle Ihre gemeinsam genutzten Pipes, Direktiven und Komponenten. Sie können auch häufig verwendete Module wie CommonModule und FormsModule exportieren. Andere Module verwenden das Modul

App-Modul . Du weißt schon, was das ist. Von Ihren eigenen erstellten Modulen müssen nur die gemeinsamen Module und die Kernmodule importiert werden.

Hier ist ein einfaches Layout

GemeinsamesModul

%Vor%

Layout-Module Beachten Sie, dass andere Module das SharedModule

verwenden %Vor%

CoreModule Zusammenführen aller Layoutmodule, aus denen die Anwendung besteht. Und fügen Sie weitere App-weite Dienste hinzu, die nicht an andere Module gebunden sind

%Vor%

AppModule

%Vor%

Siehe auch:

Paul Samsotha 07.10.2016, 00:50
quelle