web-dev-qa-db-fra.com

Angular cli générer un service et inclure le fournisseur en une étape

Il est possible de générer un service avec angular cli et de l'ajouter en tant que fournisseur dans le répertoire . app.module.ts en une seule étape ou en utilisant une option spéciale de la commande ng g service ?

Quand un exécuter:

$ ng g service services/backendApi
installing service
  create src/app/services/backend-api.service.spec.ts
  create src/app/services/backend-api.service.ts
  WARNING Service is generated but not provided, it must be provided to be used

WARNING Service is generated but not provided, it must be provided to be used

A côté de lui (et d'après le message WARNING), je l'ajoute généralement à la section du fournisseur sur app.module .ts en utilisant l’éditeur de texte:

@NgModule({
  declarations: [
    AppComponent,
    ...
  ],
  imports: [
    ....
  ],
  providers: [BackendApiService],
  bootstrap: [AppComponent]
})

Il est possible de le faire en une seule étape, pour automatiser cela?

javascripttypescriptangular-cli
50
Pablo Ezequiel

En fait, il est possible de fournir le service (ou la protection, car il faut également le fournir) lors de la création du service.

La commande est la suivante ...

ng g s services/backendApi --module=app.module

Éditer

Il est possible de fournir à un module de fonctionnalité, vous devez également lui donner le chemin d'accès au module que vous souhaitez.

ng g s services/backendApi --module=services/services.module

86
delasteve

Angular 6+ Singleton Services

Le approche recommandée pour un service singleton pour Angular 6 et au-delà est:

import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root',
})
export class UserService {
}

En fait, le commutateur CLI --modulen'existe même plus pour enregistrer un service au niveau app car il n'a plus besoin de modifier app.module.ts .

Cela créera le code ci-dessus, sans avoir besoin de spécifier un module.

ng g s services/user

Donc, si vous ne voulez pas que votre service soit un singleton, vous devez supprimer vous-même le code providedIn, puis l'ajouter manuellement à providers pour un composant ou un module chargé paresseux. Il ne semble pas qu'il y ait actuellement un commutateur pour ne pas générer la partie providedIn: 'root', vous devez donc la supprimer manuellement.

32
Simon_Weaver

léger changement de syntaxe par rapport à la réponse acceptée pour Angular 5 et angular-cli 1.7.0

ng g service backendApi --module=app.module
2
user2180794

Ajouter un service à l'application Angular 4 à l'aide de Angular CLI

Un service Angular 2 est simplement une fonction javascript, ainsi que ses propriétés et méthodes associées, qui peut être incluse (par injection de dépendances) dans les composants Angular 2.

Pour ajouter un nouveau service Angular 4 à l'application, utilisez la commande ng g service serviceName. Lors de la création du service, la CLI Angular _ affiche une erreur:

WARNING Service is generated but not provided, it must be provided to be used

Pour résoudre ce problème, nous devons fournir la référence de service à l'entrée src\app\app.module.ts à l'intérieur de providers de la méthode @NgModule.

Initialement, le code par défaut du service est:


import { Injectable } from '@angular/core';

@Injectable()
export class ServiceNameService {

  constructor() { }

}

Un service doit avoir quelques méthodes publiques.

1
student

Dans Angular 5.12 et la dernière Angular CLI, faites

ng generate service my-service -m app.module
1
Arielle Nguyen

Spécifiez les chemins

--app
  --one
    one.module.ts
    --services

  --two
    two.module.ts
    --services

Créer Service avec un nouveau dossier dans le module UN

ng g service one/services/myNewServiceFolderName/serviceOne --module one/one

--one
  one.module.ts // service imported and added to providers.
  --services
    --myNewServiceFolderName
      serviceOne.service.ts
      serviceOne.service.spec.ts
1
SoEzPz