Wie erstelle ich benutzerdefinierte Befehle (um auf dem Terminal zu laufen), um die gewünschte Komponente (mit dem gewünschten Inhalt) in angular2 zu erstellen?

9

Ich benutze angular-cli in meinem Projekt und wenn ich Befehle unten lese,   ng g c componentName dann,

Eine Komponente wird mit einem Standardtext wie unten- @Komponente ({}) usw. erstellt.

component.ts

%Vor%

Wie wird dieser Text standardmäßig erstellt, wenn die Komponente erstellt wird?

Können wir eigene benutzerdefinierte Befehle für die Komponentengenerierung mit Standardtext in component.ts und component.html (wie unten) erstellen?

custom.component.ts

%Vor%

benutzerdefinierte.component.html

%Vor%     
Ahmad mnzr 10.12.2017, 19:08
quelle

1 Antwort

4

Ich denke, Sie suchen nach @schematics. Ich habe kürzlich eine Show auf ngAir gesehen. Für den Befehl ng new gibt es die Option --collection , mit der Sie Ihre eigene benutzerdefinierte Sammlung von Vorlagen für die Verwendung mit der CLI angeben können. Es wurde in der Version 1.4.2 des CLI eingeführt. Um eine eigene Schaltplansammlung zu erstellen, müssen Sie zunächst ein paar npm-Pakete installieren. (Versionen aktuell ab heute)

%Vor%

Dann können Sie den Befehl 'schematics' wie folgt verwenden.

%Vor%

Dieser Befehl verwendet Schaltpläne selbst, um ein neues npm-Paket zu erstellen, das Sie anpassen müssen, um eine eigene Schaltplansammlung zu erstellen. Führen Sie den Befehl aus, und Sie werden feststellen, dass das Paket npm einige Schemata im Verzeichnis src enthält. Der eine, der mit meinem vollständigen Schaltplan beschriftet ist, zeigt ein Beispiel für die Verwendung eines Arguments zur Verwendung in der Vorlage. In der Datei schema.json im Verzeichnis my-full-schema sehen Sie ein Eigenschaftselement mit Kindindex und -namen. Wie so

%Vor%

Index und Name sind Argumente für den Befehl ng new für die Demo-Schaltpläne. Sie werden in den Vorlagen test_INDEX_ und test2 verwendet.

Um ehrlich zu sein, das ist eine relativ undokumentierte Eigenschaft. Ich habe es noch nicht herausgefunden, aber ich hoffe, dass es genug ist, um loszulegen.

Außerdem finden Sie hier einige Artikel, die ausführlich erklären, wie Sie Ihre Schaltplansammlung anpassen können. angularInDepth softwarearchitect

EDIT: Schematics wird aktiv weiterentwickelt und verändert sich häufig. Die neuesten Informationen dazu finden Sie in diesem Blogpost des Angular-Teams.

    
GMK 13.12.2017, 19:49
quelle

Tags und Links