staticInjection error(AppModule) : ionic 3 Ask

Ionic Framework ionic-v3
1

I’m using dialogflow in my ionic 3 app. I’m getting the error in my ts provider file.

import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Injectable } from '@angular/core';
import 'rxjs/add/operator/map';

    @Injectable()
    export class ChatProvider {

      url = 'https://api.dialogflow.com/v1/query';
      accessToken = 'xxxxxxxxxxxxxxxxxx';

      constructor(public http: HttpClient) {
        console.log('Hello ChatProvider Provider');
      }

      sendMessage(message: string) {
        let data = {
          lang: "en",
          query: message
        }
        let headers = new HttpHeaders();
        headers.append("Authorization","Bearer" + this.accessToken);
        return this.http.post(this.url, data,{headers: headers})
              .map(res => {
                return res
              })
      }

    }

and the error I’m getting is

ERROR Error: Uncaught (in promise): Error: StaticInjectorError(AppModule)[ChatProvider → HttpClient]:
StaticInjectorError(Platform: core)[ChatProvider → HttpClient]:
NullInjectorError: No provider for HttpClient!
Error: StaticInjectorError(AppModule)[ChatProvider → HttpClient]:
StaticInjectorError(Platform: core)[ChatProvider → HttpClient]:
NullInjectorError: No provider for HttpClient!
at _NullInjector.get (core.js:1003)
at resolveToken (core.js:1301)
at tryResolveToken (core.js:1243)
at StaticInjector.get (core.js:1111)
at resolveToken (core.js:1301)
at tryResolveToken (core.js:1243)
at StaticInjector.get (core.js:1111)
at resolveNgModuleDep (core.js:10896)
at _createClass (core.js:10933)
at _createProviderInstance$1 (core.js:10907)
at _NullInjector.get (core.js:1003)
at resolveToken (core.js:1301)
at tryResolveToken (core.js:1243)
at StaticInjector.get (core.js:1111)
at resolveToken (core.js:1301)
at tryResolveToken (core.js:1243)
at StaticInjector.get (core.js:1111)
at resolveNgModuleDep (core.js:10896)
at _createClass (core.js:10933)
at _createProviderInstance$1 (core.js:10907)
at c (polyfills.js:3)
at Object.reject (polyfills.js:3)
at NavControllerBase._fireError (nav-controller-base.js:223)
at NavControllerBase._failed (nav-controller-base.js:216)
at nav-controller-base.js:263
at t.invoke (polyfills.js:3)
at Object.onInvoke (core.js:4760)
at t.invoke (polyfills.js:3)
at r.run (polyfills.js:3)
at polyfills.js:3

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { Message } from '../module/message.module';
import { ChatProvider } from '../../providers/chat/chat';
@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  messages: Message[] = [];

  constructor(public navCtrl: NavController,private chatprovider: ChatProvider) {

  }

  ngOnInit(){
    let message = new Message("hi")
    this.messages.push(message);
  }

  sendMesage(message_content) {
    this.chatprovider.sendMessage(message_content.value).subscribe(res =>{
      console.log(res);
      // let message = new Message(res.result.speech);
      // this.messages.push(message);
      // message_content.value = '';
    }, err => {
      console.log(err)
    }
    )
  }
}

This is my home.ts code.

2

Hello,

maybe you need maybe httpmodule in app.module.ts.

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

and

@NgModule({
  .....
  imports: [
    HttpModule,
   .....
  ],

Best regards, anna-liebt