angular 4 - creer composants -- français

13
vertika.org by Jean Garutti -- Angular 4 -- 08/28/17 -- 1 Angular 4 Production de composants

Upload: vertika

Post on 29-Jan-2018

356 views

Category:

Education


1 download

TRANSCRIPT

Page 1: Angular 4  - creer composants -- français

vertika.org by Jean Garutti -- Angular 4 -- 08/28/17 -- 1

Angular 4

Production de composants

Page 2: Angular 4  - creer composants -- français

[email protected]

-- Angular 4 -- -- 2by Jean Garutti

je m’entoure de composants

Page 3: Angular 4  - creer composants -- français

[email protected]

-- Angular 4 -- -- 3by Jean Garutti

Angular 4 – céer des composants

la création de composants

c’est le cœur d’Angular

Jean Garutti – vertika.org

Page 4: Angular 4  - creer composants -- français

[email protected]

-- Angular 4 -- -- 4by Jean Garutti

4 – dans le Projet

Page 5: Angular 4  - creer composants -- français

[email protected]

-- Angular 4 -- -- 5by Jean Garutti

> ng g component my-new-component

nom du composantng invoque le CLI Angularg ( raccourci de générer ),

vous pouvez utiliser le mot complet générer

Créer un Composant

Page 6: Angular 4  - creer composants -- français

[email protected]

-- Angular 4 -- -- 6by Jean Garutti

> ng g component my-new-component nom du composant

Le component est le type d'élément que vous allez générer Cela aurait pu être la directive, le

pipe, le service, la classe, la guard, l'interface, l'énumération, le module)

Créer un Composant

Page 7: Angular 4  - creer composants -- français

[email protected]

-- Angular 4 -- -- 7by Jean Garutti

les composants

sont les éléments de base de votre application.

Créer un Composant

Page 8: Angular 4  - creer composants -- français

[email protected]

-- Angular 4 -- -- 8by Jean Garutti

Chaque composant comporte un template associé, une feuille de style et une classe avec une

logique.

TypeScript

Créer un Composant

Page 9: Angular 4  - creer composants -- français

[email protected]

-- Angular 4 -- -- 9by Jean Garutti

> ng g component my-new-component nom du composant

À l'intérieur de /src/app/app.module.ts, il importe le nouveau composant et l'ajoute aux déclarations.

Créer un Composant

Page 10: Angular 4  - creer composants -- français

[email protected]

-- Angular 4 -- -- 10by Jean Garutti

> ng g component my-new-component

1. installing component2. create src\app\my-new-component\my-new-

component.component.css3. create src\app\my-new-component\my-new-

component.component.html4. create src\app\my-new-component\my-new-

component.component.spec.ts5. create src\app\my-new-component\my-new-

component.component.ts6. update src\app\app.module.ts

7. garutti@GARUTTI-PC C:\Program Files\nodejs\PROJECT-NAME

Créer un Composant

Page 11: Angular 4  - creer composants -- français

[email protected]

-- Angular 4 -- -- 11by Jean Garutti

6. @NgModule({7. declarations: [8. AppComponent,9. MyNewComponentComponent10. ],11. imports: [12. BrowserModule13. ],14. providers: [],15. bootstrap: [AppComponent]16.})17.export class AppModule { }

Composant ajouté

Page 12: Angular 4  - creer composants -- français

[email protected]

-- Angular 4 -- -- 12by Jean Garutti

en 7 langues en présentiel ou e-learning

par des experts

Inscrivez-vous aux cours Angular 4

Page 13: Angular 4  - creer composants -- français

[email protected]

-- Angular 4 -- -- 13by Jean Garutti