未捕获(承诺):错误:StaticInjectorError(AppModule)[options]

Question

我有一个奇怪的错误.通常(我做谷歌搜索),在这种情况下,Angular在方括号中指定哪个模块/服务/提供者/等等引起了问题.但是在这里,它只说options.

我尝试添加HttpClientModule, HttpModule, Options到提供者/导入 - 没有成功.

试图按照这个调试指南调试未知的提供程序在minified angular javascript中,但它也没有带来任何东西(没有invoke调用堆栈,只是调用相关联Zone)

我app.components.ts看起来像这样:

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

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

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

Mozilla控制台详细回溯(当我点击下拉按钮时):

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 { … }

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

当我进入调试模式时,调用错误的最后一个函数是:

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

Answer 1

这对我有用（Angular 7）：

如果不这样做，请首先在app.module.ts中导入HttpClientModule：

import { HttpClientModule } from '@angular/common/http';
...
imports: [
        HttpClientModule
    ],

然后更改您的服务

@Injectable()
export class FooService {

至

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

希望能帮助到你。

Answer 2

也可能是您没有声明您的Dependency Injected服务,作为您将其注入的组件中的提供程序.那是我的情况:)

Answer 3

如果我们需要从一个组件移动到另一个服务，那么我们必须将该服务定义到 app.module providers 数组中。

Answer 4

我在使用类SharedModule时遇到了同样的问题。

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

然后我将其更改为以这种方式直接放入app.modules中

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

Obs：我使用的是“ @ angular / core”：“ ^ 6.0.2”。

希望对您有所帮助。

Answer 5

我有同样的错误，我通过HttpModule在 app.module.ts 中导入来解决它

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

然后在imports[]数组中：

HttpModule