Angular Academy · Lektion

Generera kod med ng generate

Skapa grundstrukturer för komponenter, tjänster och annat.

Lektion 3 av 413 steg

Generera kod med ng generate är en gratis lektion i Angular Academy på CoddyKit. Detta är lektion 3 av 4. Du kan läsa vilka 3 lektioner som helst i den här lärvägen kostnadsfritt i sin helhet – därefter låser CoddyKit PRO upp alla lektioner, plus praktisk övning med en inbyggd kodredigerare och en AI-lärare dygnet runt. Den ingår i lärvägen för Angular Academy, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i Angular Academy innehåller totalt 4 lektioner.

Generera kod med ng generate

Kommandot ng generate (förkortat till ng g) skapar Angular-byggblock med korrekt boilerplate och namngivningskonventioner.

Generera en komponent

Skapa en fristående komponent med ett enda kommando.

ng generate component hello
# short form:
ng g component hello

Det som skapas

Kommandot genererar hello.component.ts, .html, stilmallen och ett .spec.ts-test, och använder fristående som standard.

Generera i en mapp

Ange en sökväg för att placera komponenten i en undermapp.

ng g component features/dashboard

Generera en tjänst

Skapa en injicerbar tjänst med service-schemat.

ng g service data
# creates data.service.ts with @Injectable

Generera ett direktiv

Fristående direktiv skapas på motsvarande sätt.

ng g directive highlight

Generera en pipe

Skapa en anpassad pipe för omvandlingar i mallar.

ng g pipe truncate

Generera en guard

Route guards skyddar navigeringen. CLI:t skapar funktionella guards.

ng g guard auth

Förhandsgranskning med dry run

Använd dry-run-flaggan för att förhandsgranska vad som skulle skapas utan att skriva några filer.

ng g component hello --dry-run

Hoppa över testfilen

Lägg till en flagga för att hoppa över genereringen av .spec.ts-testet om Ni inte vill ha något test.

ng g component hello --skip-tests

Inline-mall och stilmallar

Ni kan begära en inline-mall och inline-stilmallar i stället för separata filer.

ng g component badge --inline-template --inline-style

Snabbkontroll: ng generate

Skapa byggblock.

Besvara frågan i den interaktiva lektionen

Sammanfattning: Generera

ng generate (ng g) skapar komponenter, tjänster, direktiv, pipes och guards enligt korrekta konventioner. Flaggor som --dry-run, --skip-tests och --inline-template anpassar resultatet. Nästa steg: bygga och köra appen.

Gratis att börja

Lär dig HTML med en AI-lärare – gratis

Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.

Kurser: 38
Lektioner: 144

Börja lära dig gratis Visa hela kursen

Vanliga frågor

Är lektionen ”Generera kod med ng generate” gratis?

Ja – du kan läsa vilka 3 lektioner som helst i lärvägen Angular Academy, inklusive ”Generera kod med ng generate”, kostnadsfritt i sin helhet här på webben. Därefter låser CoddyKit PRO upp alla lektioner, plus interaktiv övning med en inbyggd kodredigerare och en AI-lärare dygnet runt. Kursen i Angular Academy innehåller totalt 4 lektioner.

Vad lär jag mig i ”Generera kod med ng generate”?

Skapa grundstrukturer för komponenter, tjänster och annat. Ni övar på Angular Academy med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.

Behöver jag någon erfarenhet för att börja lära mig Angular Academy?

Du behöver inga förkunskaper. Utbildningen i Angular Academy på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 3 av 4.

Hur lång tid tar lektionen ”Generera kod med ng generate”?

De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.

Kan jag skriva och köra kod i den här Angular Academy-lektionen?

Ja. Varje Angular Academy-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.

Alla lektioner i den här kursen

← Tillbaka till Angular Academy