Nativescript-angular: NullInjectorError: No provider for Http!

Created on 24 Dec 2017  路  6Comments  路  Source: NativeScript/nativescript-angular

Upgraded some libraries and now i get this error:

StaticInjectorError[Http]:
  StaticInjectorError[Http]:
    NullInjectorError: No provider for Http!

here's my app.module.js, you'll see that NativeScriptHttpModule is imported as expected:

import {NgModule, NO_ERRORS_SCHEMA} from "@angular/core";
import {NativeScriptModule} from "nativescript-angular/nativescript.module";
import {NativeScriptFormsModule} from "nativescript-angular/forms";
import {NativeScriptHttpModule} from "nativescript-angular/http";

import {
  DeviceService,
  DirectionsService,
  ParamsService,
  ShuttleRideService,
  ShuttleService,
  StationService
} from "@suna/quickride-ts-libcore";

import {
  ActionBarLarge,
  AppRoutingModule,
  ConnectionInfo,
  ConnectivityService,
  EnRoutePage,
  LocationService,
  LoginPage,
  NotificationHandler,
  RideListItem,
  RideListPage,
  RouterData,
  ShuttleListItem,
  ShuttleListPage,
  TaskPage
} from "./quickride";

import {AppComponent} from "./app.component";

@NgModule({
  bootstrap: [AppComponent],
  imports: [
    NativeScriptModule,
    NativeScriptFormsModule,
    NativeScriptHttpModule,
    AppRoutingModule
  ],
  declarations: [
    ActionBarLarge,
    RideListItem,
    ShuttleListItem,
    NotificationHandler,
    ConnectionInfo,
    AppComponent,
    LoginPage,
    ShuttleListPage,
    RideListPage,
    EnRoutePage,
    TaskPage
  ],
  providers: [
    RouterData,
    DirectionsService,
    ShuttleService,
    ShuttleRideService,
    StationService,
    DeviceService,
    LocationService,
    ConnectivityService,
    ParamsService
  ],
  schemas: [
    NO_ERRORS_SCHEMA
  ]
})
export class AppModule {

}

Most helpful comment

Hi @briandilley,
Could you try replacing the old nativescript-angular/http module with the nativescript-angular/http-client? The http-client is introduced with the latest versions of Angular and it is upgraded version of http. More about it could be found here in the Angular docs.

Also, you could review our example here where it is used the http-client module.

In case the problem still persists, please provide sample project, which could be debugged locally.

All 6 comments

Hi @briandilley,
Could you try replacing the old nativescript-angular/http module with the nativescript-angular/http-client? The http-client is introduced with the latest versions of Angular and it is upgraded version of http. More about it could be found here in the Angular docs.

Also, you could review our example here where it is used the http-client module.

In case the problem still persists, please provide sample project, which could be debugged locally.

Hi, I am getting the same problem. Here is my app.module.ts and app.component.ts
app.module.ts
import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
import { NativeScriptModule } from "nativescript-angular/nativescript.module";
import { SpeechRecognition } from "nativescript-speech-recognition";
import { AppComponent } from "./app.component";
import { EventData, PropertyChangeData } from 'data/observable';
import { Page } from 'ui/page';
import { NativeScriptHttpClientModule } from "nativescript-angular/http-client";

@NgModule({
declarations: [AppComponent],
bootstrap: [AppComponent],
imports: [NativeScriptModule,NativeScriptHttpClientModule],
providers: [SpeechRecognition],
schemas: [NO_ERRORS_SCHEMA],
})
export class AppModule {}

app.component.ts

import { Component } from "@angular/core";
import { SpeechRecognition, SpeechRecognitionTranscription, SpeechRecognitionOptions } from "nativescript-speech-recognition";
import { EventData, PropertyChangeData } from 'data/observable';
import { Page } from "ui/page";
import { TextView } from "ui/text-view";
import { Switch } from "ui/Switch";
import { MyHttpGetService } from "./httpmodule/httpservice";

@Component({
selector: "my-app",
templateUrl: './appview.html',
providers: [MyHttpGetService]
})

export class AppComponent {

options: SpeechRecognitionOptions;
public textvalue: string = "Say some thing..."
public led_visibility : string = "hidden";
public ledhttplink : string = "http://192.168.1.101:8080/"

public LedSwitchState : string;
public sendColor : string;

constructor(private speech: SpeechRecognition, private page: Page,private myService: MyHttpGetService){

I have pasted till constructor as I am getting error when the objected added to it. if I remove it is working find.

This is the error
JS: ERROR Error: No provider for MyHttpGetService!
JS: ERROR CONTEXT [object Object]
JS: ns-renderer: ERROR BOOTSTRAPPING ANGULAR
JS: ns-renderer: No provider for MyHttpGetService!

Please help

Hi @somayaji1983,
Make sure that you have made your service component injectable as it shown here in nativescript-sdk-examples-ng.

Also, it would help if you send us sample project, which could be used for debugging and more info about your environment(CLI modules, runtime, nativescript-angular versions)

Error: StaticInjectorError(AppModule)[UserService -> Http]:
StaticInjectorError(Platform: core)[UserService -> Http]:
NullInjectorError: No provider for Http!
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:10854)
at _createClass (core.js:10891)
at _createProviderInstance$1 (core.js:10865)

How to resolve this error ?

Hi @somayaji1983,
Make sure that you have made your service component injectable as it shown here in nativescript-sdk-examples-ng.

Also, it would help if you send us sample project, which could be used for debugging and more info about your environment(CLI modules, runtime, nativescript-angular versions)

Hey, @tsonevn that link is throwing a 404 now, do you mind giving us a new link for the ng injection example?

Hi @WrightTrae,
You can find the example here

Was this page helpful?
0 / 5 - 0 ratings

Related issues

tsonevn picture tsonevn  路  27Comments

morzyns picture morzyns  路  39Comments

jlooper picture jlooper  路  57Comments

NathanWalker picture NathanWalker  路  32Comments

codeback picture codeback  路  34Comments