Http StaticInjectorError에 대한 공급자가 없습니다.

Http StaticInjectorError에 대한 공급자가 없습니다.

저는 제 api에서 데이터를 가져와서 제 이온 앱에 채우려고 하는데, 데이터가 채워져야 하는 페이지에 들어가면 충돌합니다.다음은 두 개의 .ts 파일입니다.

import { Component } from '@angular/core';

import { NavController, LoadingController } from 'ionic-angular';
import { RestService } from '../../providers/rest-service/rest-service';

@Component({
  selector: 'page-all-patients',
  templateUrl: 'all-patients.html',
  providers: [RestService]
})
export class AllPatientsPage {
  data: any;
  loading: any;

  constructor(public navCtrl: NavController, public restService: RestService, public loadingCtrl: LoadingController) {

    this.loading = this.loadingCtrl.create({
      content: `
        <ion-spinner></ion-spinner>`
    });
    this.getdata();
  }

  getdata() {
    this.loading.present();
    this.restService.getJsonData().subscribe(
      result => {
        this.data=result.data.children;
        console.log("Success: " + this.data);
      },
      err => {
        console.error("Error : " + err);
      },
      () => {
        this.loading.dismiss();
        console.log('getData completed');
     }
   );
 }
}

그리고 다른 파일:

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

/*
  Generated class for the RestServiceProvider provider.

  See https://angular.io/guide/dependency-injection for more info on providers
  and Angular DI.
*/

@Injectable()
export class RestService {

  constructor(public http: Http) {
    console.log('Hello RestServiceProvider Provider');
  }

  getJsonData() {
    // return Promise.resolve(this.data);

     return this.http.get('url').map(res => res.json());
   }

}

Http Module도 사용해봤지만 치명적인 오류입니다.오류는 다음과 같습니다.

Error: Uncaught (in promise): Error: StaticInjectorError[Http]: 
  StaticInjectorError[Http]: 
    NullInjectorError: No provider for Http!
Error: StaticInjectorError[Http]: 
  StaticInjectorError[Http]: 
    NullInjectorError: No provider for Http!
    at _NullInjector.get (http://lndapp.wpi.edu:8100/build/vendor.js:1276:19)

이온 프레임워크를 통해 생성된 공급자이기 때문에 공급자 오류가 없는 이유를 잘 모르겠습니다.

앱에서 Http를 사용하려면 HttpModule을 app.module.ts에 추가해야 합니다.

import { BrowserModule } from '@angular/platform-browser';
import { NgModule, ErrorHandler } from '@angular/core';
import { HttpModule } from '@angular/http';
...
  imports: [
    BrowserModule,
    HttpModule,
    IonicModule.forRoot(MyApp),
    IonicStorageModule.forRoot()
  ]

편집

아래 설명에서 언급한 것처럼, is now, use; 배열에서 확인합니다.

업데이트: Angular v6+

이전 버전(Angular v2 - v5)에서 변환된 앱의 경우:HttpModule은 이제 더 이상 사용되지 않으므로 HttpClientModule로 교체해야 합니다. 그렇지 않으면 오류가 발생합니다.

1. app.module.ts가 대체합니다.import { HttpModule } from '@angular/http';새 HttpClient 모듈을 사용하여import { HttpClientModule} from "@angular/common/http"; 참고: 모듈을 업데이트해야 합니다.imports[]오래된 것을 제거하여 배열합니다.HttpModule그리고 그것을 새로운 것으로 대체합니다.HttpClientModule.
2. HttpModule을 사용한 모든 서비스에서 대체import { Http } from '@angular/http';새로운 HttpClient를 사용하여import { HttpClient } from '@angular/common/http';

3. Http 응답 처리 방법을 업데이트합니다.예: 다음과 같은 코드가 있는 경우

   http.get('people.json').subscribe((res:Response) => this.people = res.json());

위의 코드 예제에서는 오류가 발생합니다.응답이 구성 개체에서 이미 JSON으로 반환되기 때문에 더 이상 구문 분석할 필요가 없습니다.

헤드라인 등록 콜백은 데이터 필드를 구성 요소의 구성 개체로 복사합니다. 이 개체는 표시하기 위해 구성 요소 템플릿에서 데이터 바인딩됩니다.

자세한 내용은 - Angular HttpClient Module - 공식 문서를 참조하십시오.

또한 다음을 가져올 필요가 있습니다.HttpClientModuleAngular'@angular/common/http'HTTP 요청을 수행하기 위해 기본 AppModule로 이동합니다.

app.s.ts.

import { HttpClientModule } from '@angular/common/http';
import { ServiceService } from '../../../services/service.service';

@NgModule({
   imports: [
       HttpClientModule
   ],
   providers: [
       ServiceService
   ]
})
export class AppModule {...}

이 두 개의 파일을 추가합니다.app.module.ts

import { FileTransfer } from '@ionic-native/file-transfer';
import { File } from '@ionic-native/file';

그 후에 이것들을 제공자에게 선언합니다.

providers: [
    Api,
    Items,
    User,
    Camera,
    File,
    FileTransfer];

이것은 나를 위한 일입니다.

나는 (불행히도) 소스 코드 포함을 사용하는 각진 프로젝트에 참여하고 있습니다.tsconfig.json여러 코드 모음을 연결합니다.비슷한 것을 발견했습니다.StaticInjector서비스에 대한 오류(예:RestService위의 예에서) 그리고 나는 서비스 종속성을 목록화함으로써 그것을 고칠 수 있었습니다.deps모듈에서 영향을 받는 서비스를 제공하는 경우 배열. 예:

import { HttpClient } from '@angular/common/http';
import { NgModule } from '@angular/core';
import { HttpModule } from '@angular/http';
import { RestService } from 'mylib/src/rest/rest.service';
...
@NgModule({
  imports: [
    ...
    HttpModule,
    ...
  ],
  providers: [
    {
      provide: RestService,
      useClass: RestService,
      deps: [HttpClient] /* the injected services in the constructor for RestService */
    },
  ]
  ...

이온 4.6에서는 다음과 같은 기술을 사용하며 작동합니다.새로운 이온 버전 앱에서 유사한 문제에 직면한 사람이 있다면 도움이 될 수 있도록 답변을 추가합니다.

app.module.ts를 열고 다음 코드 블록을 추가하여 HttpModule 및 HttpClientModule을 가져옵니다.

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

ii) @NgModule 가져오기 섹션에 다음 행을 추가합니다.

HttpModule,
HttpClientModule,

@NgModule의 경우 다음과 같습니다.

@NgModule({
  declarations: [AppComponent ],
  entryComponents: [ ],
  imports: [
    BrowserModule,
    HttpModule,
    HttpClientModule,
    IonicModule.forRoot(),
    AppRoutingModule, 
  ],
  providers: [
    StatusBar,
    SplashScreen,
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
  ],
  bootstrap: [AppComponent]
})

바로 그거야!

한 시간 정도 문제를 해결하려고 하다가 서버를 다시 시작하려고 장치를 했어요.문제가 해결된 것은 문제를 확인하는 것뿐입니다.

APP 모듈을 변경했지만 문제가 그대로 유지되면 서버를 중지하고 serve 명령을 다시 실행하십시오.

각이 7인 이온 4 사용

언급URL : https://stackoverflow.com/questions/47492475/no-provider-for-http-staticinjectorerror