ERROR Error: StaticInjectorError(AppModule)[StorieControllerComponent -> DataService]:
20,303
In your app.module
you forgot to add DataService
to your provider array
Author by
Admin
Updated on June 27, 2020Comments
-
Admin almost 4 years
I am getting this error and I already check all the import and Modules.
I am trying to access to a
JSON
file inside my project and use that data in an object but I not sure what is the problem here. I have my object well define with myJSON
and I am not sure that the problem is with the HttpThis is the Error that I am getting in the console:
This is the Service
import { storiesStatus } from './stories'; import { Injectable } from '@angular/core'; import { NgModule } from '@angular/core'; import { HttpClientModule } from '@angular/common/http'; import { Headers, Http, Response, HttpModule} from '@angular/http'; const storiesJson = './../json/stories_data_json.json'; @Injectable() export class DataService { constructor(private http: Http) { } getStoriesData(): Promise<storiesStatus[]> { return this.http.get(storiesJson) .toPromise() .then(response => response.json() as storiesStatus[]) .catch(); } }
This is my App Module:
import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import * as Hammer from 'hammerjs'; import 'hammer-timejs'; import { HammerGestureConfig, HAMMER_GESTURE_CONFIG } from '@angular/platform-browser'; import { Router, NavigationEnd, ActivatedRoute } from '@angular/router'; import { ChartsModule } from 'ng2-charts'; import { AppComponent } from './app.component'; import { AppChildModule } from './modules/app-child.module'; import { CheckinComponent } from './modules/controllers/checkin/checkin.component'; import { PicturePostComponent } from './modules/controllers/picture- post/picture-post.component'; import { StorieControllerComponent } from './modules/controllers/storie- controller/storie-controller.component'; import { LoginComponent } from './modules/screens/login/login.component'; import { router } from './modules/routing/app-routing.module'; import { FeedComponent } from './modules/screens/home/feed/feed.component'; import { HomeComponent } from './modules/screens/home/home.component'; import { WelcomeComponent } from './modules/screens/welcome/welcome.component'; import { SignupComponent } from './modules/screens/signup/signup.component'; import { HttpClientModule } from '@angular/common/http'; import { HttpModule } from '@angular/http'; import { BrowserAnimationsModule } from '@angular/platform- browser/animations'; export class MyHammerConfig extends HammerGestureConfig { overrides = <any>{ 'swipe': { direction: Hammer.DIRECTION_ALL } } } @NgModule({ declarations: [ AppComponent, LoginComponent, HomeComponent, WelcomeComponent, SignupComponent ], imports: [ BrowserModule, HttpClientModule, HttpModule, AppChildModule, ChartsModule, BrowserAnimationsModule, router ], providers: [{ provide: HAMMER_GESTURE_CONFIG, useClass: MyHammerConfig }], bootstrap: [AppComponent] }) export class AppModule { }
This is my component conected to the service:
import { DataService } from '../../../../assets/services/data.service'; import { storiesStatus } from '../../../../assets/services/stories'; import { Component, OnInit } from '@angular/core'; import { NgModule } from '@angular/core'; import { Headers, Http, Response, HttpModule} from '@angular/http'; @Component({ selector: 'app-storie-controller', templateUrl: './storie-controller.component.html', styleUrls: ['./storie-controller.component.css'] }) @NgModule({ declarations: [] }) export class StorieControllerComponent implements OnInit { public stories: storiesStatus[]; constructor(private data: DataService) { this.stories = []; } ngOnInit() { this.data.getStoriesData().then(storiesRes => console.log( this.stories = storiesRes)); } }
-
Admin over 6 yearsI tried that But I get this error: Uncaught Error: Unexpected value 'DataService' imported by the module 'AppModule'. Please add a @NgModule annotation.
-
Mike Tung over 6 yearsUpdate your App Module to show how you did it, you have to make sure you only put in
providers: [DataService]
-
rrd over 6 yearsYou'll need to import it too, which you currently don't.
-
Admin over 6 yearsOh, I was missing a comma on the providers, alright hahahaha Thank you !!