web-dev-qa-db-fra.com

Non capturé (promis): Erreur: StaticInjectorError (AppModule) [options]

J'ai une erreur étrange. Habituellement (j'ai fait mes recherches sur Google), dans ce cas d'erreur, Angular spécifie entre crochets quel module/service/fournisseur/etc a exactement causé le problème. Cependant ici, il est dit que options.

J'ai essayé d'ajouter HttpClientModule, HttpModule, Options aux fournisseurs/importations - sans succès.

J'ai essayé de suivre ce guide de débogage Débogage d'un fournisseur inconnu en javascript angulaire minifié mais cela ne m'a pas amené à rien (non invoke sur la pile d'appels, invoque simplement associé à Zone)

mon app.components.ts ressemble à ceci:

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

@Component({
  selector: 'app-root',
  template: `<router-outlet></router-outlet>`,
})
export class AppComponent {
  constructor() {}
}

Traceback de la console Mozilla:

Error: [object Object]
Stack trace:
resolvePromise@webpack-internal:///../../../../zone.js/dist/zone.js:783:31
resolvePromise@webpack-internal:///../../../../zone.js/dist/zone.js:754:17
scheduleResolveOrReject/<@webpack-internal:///../../../../zone.js/dist/zone.js:831:17
ZoneDelegate.prototype.invokeTask@webpack-internal:///../../../../zone.js/dist/zone.js:424:17
onInvokeTask@webpack-internal:///../../../core/esm5/core.js:4952:24
ZoneDelegate.prototype.invokeTask@webpack-internal:///../../../../zone.js/dist/zone.js:423:17
Zone.prototype.runTask@webpack-internal:///../../../../zone.js/dist/zone.js:191:28
drainMicroTaskQueue@webpack-internal:///../../../../zone.js/dist/zone.js:595:25
ZoneTask.invokeTask@webpack-internal:///../../../../zone.js/dist/zone.js:502:21
invokeTask@webpack-internal:///../../../../zone.js/dist/zone.js:1370:9
globalZoneAwareCallback@webpack-internal:///../../../../zone.js/dist/zone.js:1388:17

Traceback détaillé de la console Mozilla (lorsque je clique sur le bouton déroulant):

Error
​
columnNumber: 31
​
fileName: "http://localhost:4100/polyfills.bundle.js line 733 > eval"
​
lineNumber: 783
​
message: "Uncaught (in promise): Error: StaticInjectorError(AppModule)[options]: \n  StaticInjectorError(Platform: core)[options]: \n    NullInjectorError: No provider for options!\n_NullInjector.prototype.get@webpack-internal:///../../../core/esm5/core.js:1218:19\nresolveToken@webpack-internal:///../../../core/esm5/core.js:1516:17\ntryResolveToken@webpack-internal:///../../../core/esm5/core.js:1458:16\nStaticInjector.prototype.get@webpack-internal:///../../../core/esm5/core.js:1326:20\nresolveToken@webpack-internal:///../../../core/esm5/core.js:1516:17\ntryResolveToken@webpack-internal:///../../../core/esm5/core.js:1458:16\nStaticInjector.prototype.get@webpack-internal:///../../../core/esm5/core.js:1326:20\nresolveNgModuleDep@webpack-internal:///../../../core/esm5/core.js:11065:12\n_createClass@webpack-internal:///../../../core/esm5/core.js:11102:29\n_createProviderInstance$1@webpack-internal:///../../../core/esm5/core.js:11076:26\nresolveNgModuleDep@webpack-internal:///../../../core/esm5/core.js:11061:17\n_…"
​
promise: Object { __zone_symbol__state: 0, __zone_symbol__value: Error }
​
rejection: Error: StaticInjectorError(AppModule)[options]: 
  StaticInjectorError(Platform: core)[options]: 
    NullInjectorError: No provider for options!
Stack trace:
[object Object]
​
stack: "resolvePromise@webpack-internal:///../../../../zone.js/dist/zone.js:783:31\nresolvePromise@webpack-internal:///../../../../zone.js/dist/zone.js:754:17\nscheduleResolveOrReject/<@webpack-internal:///../../../../zone.js/dist/zone.js:831:17\nZoneDelegate.prototype.invokeTask@webpack-internal:///../../../../zone.js/dist/zone.js:424:17\nonInvokeTask@webpack-internal:///../../../core/esm5/core.js:4952:24\nZoneDelegate.prototype.invokeTask@webpack-internal:///../../../../zone.js/dist/zone.js:423:17\nZone.prototype.runTask@webpack-internal:///../../../../zone.js/dist/zone.js:191:28\ndrainMicroTaskQueue@webpack-internal:///../../../../zone.js/dist/zone.js:595:25\nZoneTask.invokeTask@webpack-internal:///../../../../zone.js/dist/zone.js:502:21\ninvokeTask@webpack-internal:///../../../../zone.js/dist/zone.js:1370:9\nglobalZoneAwareCallback@webpack-internal:///../../../../zone.js/dist/zone.js:1388:17\n"
​
task: Object { runCount: 0, _state: "notScheduled", type: "microTask", … }
​
zone: Object { _properties: {…}, _parent: {…}, _name: "angular", … }
​
__proto__: Object { … }

Traceback de la console Google Chrome:

core.js:1448 ERROR Error: Uncaught (in promise): Error: StaticInjectorError(AppModule)[options]: 
  StaticInjectorError(Platform: core)[options]: 
    NullInjectorError: No provider for options!
Error: StaticInjectorError(AppModule)[options]: 
  StaticInjectorError(Platform: core)[options]: 
    NullInjectorError: No provider for options!
    at _NullInjector.get (core.js:1002)
    at resolveToken (core.js:1300)
    at tryResolveToken (core.js:1242)
    at StaticInjector.get (core.js:1110)
    at resolveToken (core.js:1300)
    at tryResolveToken (core.js:1242)
    at StaticInjector.get (core.js:1110)
    at resolveNgModuleDep (core.js:10849)
    at _createClass (core.js:10886)
    at _createProviderInstance$1 (core.js:10860)
    at _NullInjector.get (core.js:1002)
    at resolveToken (core.js:1300)
    at tryResolveToken (core.js:1242)
    at StaticInjector.get (core.js:1110)
    at resolveToken (core.js:1300)
    at tryResolveToken (core.js:1242)
    at StaticInjector.get (core.js:1110)
    at resolveNgModuleDep (core.js:10849)
    at _createClass (core.js:10886)
    at _createProviderInstance$1 (core.js:10860)
    at resolvePromise (zone.js:783)
    at resolvePromise (zone.js:754)
    at eval (zone.js:831)
    at ZoneDelegate.invokeTask (zone.js:424)
    at Object.onInvokeTask (core.js:4736)
    at ZoneDelegate.invokeTask (zone.js:423)
    at Zone.runTask (zone.js:191)
    at drainMicroTaskQueue (zone.js:595)
    at ZoneTask.invokeTask [as invoke] (zone.js:502)
    at invokeTask (zone.js:1370)
defaultErrorLogger @ core.js:1448

Lorsque je passe en mode débogage, la dernière fonction qui appelle l'erreur est la suivante:

function defaultErrorLogger(console) {
    var values = [];
    for (var _i = 1; _i < arguments.length; _i++) {
        values[_i - 1] = arguments[_i];
    }
    console.error.apply(console, values);
}
7
trthhrtz

Il se peut également que vous n'ayez pas déclaré votre service Dependency Injected en tant que fournisseur du composant auquel vous l'avez injecté. C'était mon cas :) 

8
azrahel

J'avais le même problème en utilisant ma classe SharedModule.

export class SharedModule {
    static forRoot(): ModuleWithProviders {
        return {
            ngModule: SharedModule,
            providers: [MyService]
         }
     }
}

Puis je l'ai changé en mettant directement dans les app.modules de cette façon

@NgModule({declarations: [
AppComponent,
NaviComponent],imports: [BrowserModule,RouterModule.forRoot(ROUTES),providers: [MoviesService],bootstrap: [MyService] })

Obs: J'utilise "@ angular/core": "^ 6.0.2".

J'espère que cela vous aidera.

3

Si nous devons passer d'un composant à un autre service, nous devons définir ce service dans le tableau de fournisseurs app.module. 

1
divyanshu gupta

HttpClientModule doit figurer dans le tableau imports et le supprimer des fournisseurs. Cette section vous permet de dire à Angular quels services le module a (écrits par vous et non importés d'une bibliothèque).

1
Ramki

J'ai eu la même erreur et je l'ai résolue en important HttpModule dans app.module.ts

import { HttpModule } from '@angular/http';

puis dans le tableau imports[]:

HttpModule
0
mohamed saad

Face à la même erreur. Dans mon cas, ce que j'ai fait de mal, c'est d'avoir injecté le service (nommé DataService dans mon cas) à l'intérieur du constructeur du composant, mais j'ai tout simplement oublié de l'importer dans le composant.

 constructor(private dataService:DataService ) {
    console.log("constructor called");
  }

J'ai raté le code d'importation ci-dessous.

import { DataService } from '../../services/data.service';
0
Vaibs

Dans mon cas, l'erreur était d'utiliser angular2-notifications 0.9.8 au lieu de 0.9.7 

0
trthhrtz