webentwicklung-frage-antwort-db.com.de

Erstellen Sie mit Angular-CLI eine Komponente für ein bestimmtes Modul

Ich fange an, eckig-cli zu verwenden, und ich habe bereits viel gelesen, um eine Antwort zu finden, was ich tun möchte ... kein Erfolg, also bin ich hierher gekommen.

Gibt es eine Möglichkeit, eine Komponente für ein neues Modul zu erstellen? 

z.B.: ng g module newModule

ng g component newComponent (wie man diese Komponente in newModule hinzufügt ??)

das Standardverhalten von angle-cli besteht darin, alle neuen Komponenten in app.module zu legen. Ich möchte auswählen, wo sich meine Komponente befinden wird, sodass ich getrennte Module erstellen kann und nicht alle meine Komponenten in app.module enthalten muss. Es ist möglich, das mit angle-cli zu tun, oder muss ich das manuell machen?

85
Elmer Dantas

Um eine Komponente als Teil eines Moduls anzulegen, sollten Sie dies tun

  1. ng g module newModule um ein Modul zu generieren, 
  2. cd newModule, um das Verzeichnis in den Ordner newModule zu ändern 
  3. ng g component newComponent, um eine Komponente als untergeordnetes Element des Moduls zu erstellen.
117
ng g component nameComponent --module=app.module.ts

Ich bin mir nicht sicher, ob Alexander Ciesielskis Antwort zum Zeitpunkt des Schreibens vielleicht richtig war, aber ich kann bestätigen, dass dies nicht mehr funktioniert. Es ist egal, in welchem ​​Verzeichnis des Projekts Sie die Angular-CLI ausführen. Wenn du schreibst 

ng g component newComponent

es generiert eine Komponente und importiert sie in die Datei app.module.ts

Die einzige Möglichkeit, die CLI zum automatischen Importieren in ein anderes Modul zu verwenden, ist die Angabe

ng g component moduleName/newComponent

dabei ist moduleName ein Modul, das Sie bereits in Ihrem Projekt definiert haben. Wenn der Modulname nicht vorhanden ist, wird die Komponente im Verzeichnis moduleName/newComponent abgelegt, jedoch in app.module importiert

57
Diskdrive

Ich habe keine Antwort gefunden, die zeigte, wie man mit cli eine Komponente in einem Modulordner der obersten Ebene generiert. Außerdem hat die Komponente automatisch die Deklarationssammlung des Moduls hinzugefügt.

Um das Modul zu erstellen, führen Sie folgendes aus:

ng g module foo

Um die Komponente im foo-Modulordner zu erstellen und zur Deklarationssammlung von foo.module.ts hinzuzufügen, führen Sie Folgendes aus:

ng g component foo/fooList --module=foo.module.ts

Und das cli wird das Modul und die Komponente folgendermaßen ausrüsten:

 enter image description here

--EDIT Die neue Version des Winkelcli verhält sich anders. 1.5.5 möchte keinen Moduldateinamen, daher sollte der Befehl in Version 1.5.5 sein 

ng g component foo/fooList --module=foo
20
cobolstinks

Sie können unter dem folgenden Befehl versuchen, der das beschreibt,

ng -> Angular 
g  -> Generate
c  -> Component
-m -> Module 

Dann wird Ihr Befehl so sein:

ng g c user/userComponent -m user.module
9
user2662006

das hat bei mir funktioniert:

1 -->  ng g module new-module

2 -->  ng g c new-module/component-test --module=new-module/new-module.module.ts

Wenn Sie eine Komponente ohne Verzeichnis erstellen möchten, verwenden Sie das Flag --flat.

6

Für Angular v4 und Above verwenden Sie einfach:

ng g c componentName -m ModuleName
4
Shemzz

Verwenden Sie diesen einfachen Befehl:

ng g c users/userlist

users: Ihr Modulname.

userlist: Ihr Komponentenname.

1
Hasan Fathi

Ich habe ein komponentenbasiertes Kindermodul mit einem bestimmten Stammordner erstellt

Diesen CLI-Befehl habe ich unten angegeben, bitte überprüfen Sie

ng g c Repair/RepairHome -m Repair/repair.module

Repair ist Root-Ordner unseres Kindermoduls

-m ist --module

c für compount

g zum generieren

1
sathish

Angular Docs zufolge besteht der Weg zum Erstellen einer Komponente für ein bestimmtes Modul darin,

ng g component <directory name>/<component name>

"verzeichnisname" = wo die CLI das Feature-Modul generiert hat

Beispiel: - 

ng generate component customer-dashboard/CustomerDashboard

Dies generiert einen Ordner für die neue Komponente innerhalb des Customer-Dashboard-Ordners und aktualisiert das Funktionsmodul mit der CustomerDashboardComponent

1
Sksaif Uddin
  1. Zunächst generieren Sie ein Modul, indem Sie ausführen.
ng g m modules/media

dadurch wird ein Modul mit dem Namen media im Ordner modules erstellt.

  1. Zweitens generieren Sie eine Komponente, die zu diesem Modul hinzugefügt wird
ng g c modules/media/picPick --module=modules/media/media.module.ts

der erste Teil des Befehls ng g c modules/media/picPick generiert einen Komponentenordner mit dem Namen picPick im Ordner modules/media, der unser neues Modul media enthält.

im zweiten Teil wird unsere neue Komponente picPick im Modul media deklariert, indem sie in die Moduldatei importiert und an das Array declarations dieses Moduls angehängt wird.

 working tree 

 enter image description here 

1
Elhakim

Wenn Sie mehrere Apps in .angular-cli.json deklariert haben (z. B. wenn Sie an einem Funktionsmodul arbeiten)

"apps": [{
    "name": "app-name",
    "root": "lib",
    "appRoot": ""
}, {...} ]

Sie können : 

ng g c my-comp -a app-name

-a steht für --app (Name)

0
Sam

Hinzufügen einer Komponente zur Angular 4-App mithilfe von Angular CLI

Verwenden Sie den Befehl ng g component componentName, um der App eine neue Angular 4-Komponente hinzuzufügen. Nach der Ausführung dieses Befehls fügt Angular CLI unter component-name einen Ordner src\app hinzu. Die Verweise desselben werden automatisch zur src\app\app.module.ts-Datei hinzugefügt.

Eine Komponente muss eine @Component-Dekorationsfunktion gefolgt von einer class haben, die exported sein muss. Die Decorator-Funktion @Component akzeptiert Metadaten.

Hinzufügen einer Komponente zu einem bestimmten Ordner der Angular 4-App mithilfe von Angular CLI

Um eine neue Komponente zu einem bestimmten Ordner hinzuzufügen, verwenden Sie den Befehl ng g component folderName/componentName

0
student

Ich habe ähnliche Probleme mit mehreren Modulen in der Anwendung. Eine Komponente kann für jedes Modul erstellt werden. Bevor Sie eine Komponente erstellen, müssen Sie den Namen des jeweiligen Moduls angeben.

'ng generate component newCompName --module= specify name of module'
0
vivek

Führen Sie zuerst ng g module newModule.__ aus. Dann führen Sie ng g component newModule/newModule --flat aus.

0
Tuan van Duong

Ich arbeite gerade an 5-Winkel-Projekten und benutze diesen speziellen Befehl, um Komponenten innerhalb eines Moduls zu erzeugen.

ng g c <module-name>/<new-component-name>

Dieser Befehl generiert eine lokale Komponente des Moduls, wenn Sie einen normalen Befehl verwenden, z

ng g c <component-name>

es generiert eine Komponente innerhalb des App-Moduls a.k.a root-Modul.

Hinweis: In <> eingeschlossener Code steht für benutzerspezifische Namen. 

0
Shashank Rawat