新米エンジニアの失敗再発防止メモ

自分そしてこの世界の皆が、同じ失敗をしないためのメモ

Twitterやってます!@rakuton_t
欲しいものリストのブタメンを送ってくれた方、ありがとうございます!

【Angular】ERROR Error: Uncaught (in promise): Error: StaticInjectorError[e]

エラー(省略)

ERROR Error: Uncaught (in promise): Error: StaticInjectorError[e]

原因と対応方法

app.module.ts で、必要なモジュールがimportされていない時に発生します。
私の場合は、Httpを使おうとしたら以下のようになりました。
エラーの全文です。

ERROR Error: Uncaught (in promise): Error: StaticInjectorError(AppModule)[Http]: 
  StaticInjectorError(Platform: core)[Http]: 
    NullInjectorError: No provider for Http!
Error: StaticInjectorError(AppModule)[Http]: 
  StaticInjectorError(Platform: core)[Http]: 
    NullInjectorError: No provider for Http!
    at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (core.js:3228)
    at resolveToken (core.js:3473)
    at tryResolveToken (core.js:3417)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (core.js:3314)
    at resolveToken (core.js:3473)
    at tryResolveToken (core.js:3417)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (core.js:3314)
    at resolveNgModuleDep (core.js:19784)
    at NgModuleRef_.push../node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (core.js:20473)
    at injectInjectorOnly (core.js:1194)
    at resolvePromise (zone.js:831)
    at resolvePromise (zone.js:788)
    at zone.js:892
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:423)
    at Object.onInvokeTask (core.js:16147)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:422)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:195)
    at drainMicroTaskQueue (zone.js:601)

私の場合の解決方法

Httpを使う場合の解決方法です。
まず、app.module.tsでHttpModuleをimportします。

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

JsonpModuleは、使わないなら要らないです。

そして

  imports: [
    BrowserModule,
    AppRoutingModule,
    HttpModule, // これを追加
    JsonpModule
  ],

以上です!なんかわからないことあったら聞いてください。

私の記事が役に立ったら、どうぞ何か買ってください!→ Amazon欲しいものリスト