首页 文章

Angular 4和Ionic 3没有HTTP的提供者

提问于
浏览
21

我有一个导入Http的服务,当我在我的应用程序中使用它时会抛出错误 . “ No provider for Http! Error at g injectionError ". I am lazyloading the app. Also the provider was generated through cli " ionic g provider ...

complaint-service.ts

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
export class ComplaintService {
    private complaints: {subject: string, description: string}[] = [];

    constructor(public http: Http) {
        this.http = http;
        this.complaints = null;
        console.log('Hello ComplaintService Provider');
    }

    addComplaints(complaint: {subject: string, description: string}) {
        this.complaints.push(complaint);
    }

    getComplaints() {
        return this.complaints.slice();
    }

}

complaint-form.ts

import { Component } from '@angular/core';
import {Validators, FormBuilder, FormGroup } from '@angular/forms';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import {ComplaintService} from '../../providers/complaint-service';


@IonicPage()
@Component({
  selector: 'page-complaint-form',
  templateUrl: 'complaint-form.html',
  providers: [ComplaintService]
})
export class ComplaintForm {

}

有什么建议?

4 回答

  • 64

    您必须将 HttpModule 注册到您的模块( /app.module.ts ):

    import { HttpModule} from '@angular/http';
    
    @NgModule({
      imports: [
        HttpModule
      ],
      declarations: [ AppComponent ],
      bootstrap:    [ AppComponent ]
    })
    export class AppModule {
    }
    
  • 0

    HTTP 添加到提供者列表中 . (至 AppModule

    import { HTTP } from '@ionic-native/http';
    

    providers: [
        ...,
        HTTP 
      ]
    

    使用Angulat5,Ionic 3

  • 0

    HttpModule在最新版本的ionic3和Angular5中已被弃用 . 因此,您必须使用HttpClientModule而不是HttpModule . 其他事情与@ devqon的答案相同 . 之后,您可以在服务或组件文件中使用HttpClient .

    有关详细信息,请参阅Angular的原始文档 .

    https://angular.io/guide/http

    import {HttpClientModule} from "@angular/common/http";
    
    @NgModule({
      imports: [
        HttpClientModule
     ],
     declarations: [ AppComponent ],
     bootstrap:    [ AppComponent ]
    })
    export class AppModule {
    }
    
  • 0
    import {HttpClientModule} from "@angular/common/http";
    
    @NgModule({
      declarations: [
        ChatPage,
      ],
      imports: [
        IonicPageModule.forChild(ChatPage),
        HttpModule,
        HttpClientModule,// add HttpClientModule to import
        SocketIoModule.forRoot(config)
      ],
    
    })
    

    不要忘记运行 ionic cordova run browser 因为你需要一个平台来运行cordova插件

相关问题