web-dev-qa-db-fra.com

A quoi sert le fichier app.module.ts, que dois-je faire à l'intérieur?

Je m'habitue à Angular 2 mais j'ai quelques questions concernant le fichier app.module.ts .

  • Pourquoi dois-je faire les importations dans ce fichier car je ferai à nouveau les entrées dans le fichier app.components.ts .

Par exemple: j'importe ma pipe personnalisée et puis je dois l'importer dans mon app.components.ts fichier

import { FirstPipePipe } from './first-pipe.pipe';

@NgModule({
     declarations: [
       AppComponent,
       SecondComponent,
       ThirdComponent,
       FirstComponent,
       FirstPipePipe
     ],
     imports: [
       BrowserModule, RouterModule.forRoot(appRoutes), HttpModule
     ],
     providers: [FetchDataService],
     bootstrap: [AppComponent]    })

Ensuite, j'ai le

imports: [
           BrowserModule, RouterModule.forRoot(appRoutes), HttpModule
         ],

Pourquoi dois-je importer certaines classes et d'autres non?

Pourquoi les fournisseurs sont-ils ici, car encore une fois, ils apparaissent dans app.component.ts 

providers: [FetchDataService]

Fondamentalement, je dois tout réécrire dans mon fichier app.component.ts .

Quel est le but de app.module.ts?

angularimportangular-servicesangular-module
12
masterach

Les modules sont un moyen d'organiser et de séparer votre code. Vous pouvez avoir plusieurs modules et charger paresseusement certains modules.

Vous importez tous les autres modules dans la section imports.

Vous déclarez tous les composants de votre declarations. Tous les composants utilisés dans le routage de ce module doivent être déclarés dans ce module. Si des composants sont utilisés dans un autre module, vous ne les répertoriez que dans cet autre module.

Et vous fournissez vos services dans la section providers.

Les modules permettent également de contrôler votre injection de dépendances ... Vous pouvez provide services au niveau du composant ou au niveau du module. La fourniture de services au niveau du module crée une instance du service à partager sur l'ensemble du module. Si vous fournissez un service au niveau du composant, il s'agit d'une instance unique pour ce composant. Il peut être préférable de ne fournir un service qu'à un seul niveau pour éviter toute confusion - soit au niveau du module, soit au niveau du composant (dans chaque composant, vous en avez besoin). Je trouve que la plupart du temps, pour moi, il est préférable et plus facile de ne fournir des services qu'au niveau du module. Même chose avec pipes et autres, bien que tout composant/tuyau que vous créez doive toujours être déclaré dans le declarations.

10
Tyler Jennings

Quel est le but de app.module.ts?

  • Il s'agit de démarrer votre application, et de définir les liens vers vos autres modules .

1 - Les modules sont les couches logiques de votre application. Chaque module est là pour emballer les choses de manière logique, afin qu'il soit plus facile pour les gens de comprendre et de maintenir votre application, composée de plusieurs modules. Par exemple, si vous faites une application riche, vous devriez avoir un LoginModule , un AuthenticationModule , etc ...

2 - Vous devez importer des éléments dans votre module pour que Angular sache ce qu'il va utiliser. Fondamentalement, votre LoginModule aura besoin du Angular FormModule , qui peut ne pas être nécessaire pour le AuthenticationModule

3 - Cela nous amène ici: Le AppModule ne devrait donc importer que le d'autres modules auxquels il est lié et fournissent les services qui seront nécessaires globalement . Votre futur LoginModule n'aura pas besoin d'un service à fournir, mais le AuthenticationModule , qui aura un AuthenticationService le fera très probablement.

Ce sont les concepts de base, essayez de lire la documentation officielle qui offre beaucoup de connaissances sur ce sujet: https://angular.io/guide/ngmodule

3
Alex Beugnet

Qu'est-ce que AppModuleAppModule est le module racine qui amorce et lance l'application angular. Vous pouvez le nommer comme vous voulez, mais par convention, il est nommé AppModule.

Il importe 2 modules système - BrowserModule et NgModule

BrowserModule - Chaque application qui s'exécute dans un navigateur a besoin de ce module. Les directives NgIf et NgFor sont également fournies par ce module.

NgModule - @component le décorateur ajoute des métadonnées à une classe de composants angular, de même @NgModule le décorateur ajoute des métadonnées à la classe de module angular.

0
vivek nuna