'@angular/common/http' 모듈을 찾을 수 없습니다.
저는 Angular about Http에 대한 이 기본적인 튜토리얼을 따르고 있습니다.
설정: 모듈 설치 섹션에서 볼 수 있듯이 HttpClientModule은 다음과 같이 가져옵니다.
import {HttpClientModule} from '@angular/common/http';
프로젝트에서 이를 시도하면 "Cannot find module '@angular/common/http'"라는 오류가 나타납니다.
저는 다음 모듈을 가져오기 위해 다음과 같이 시도했습니다.
import { HttpModule } from '@angular/http';
다음은 제 수입 섹션입니다.
imports: [
HttpModule
],
문제는 이 HttpModule을 서비스 개체에 주입할 수 없고 "Cannot find module"(모듈 HttpModule을 찾을 수 없음) 오류가 발생한다는 것입니다.
서비스 클래스는 다음과 같습니다.
import { Injectable, OnInit } from '@angular/core';
//Custom Models
import { Feed } from '../Models/Feed';
@Injectable()
export class FeedsService {
constructor(private httpClient: HttpModule) {}
}
내가 뭘 잘못하고 있는 거지?
업데이트 튜토리얼에 따라 모듈을 가져올 수 없다는 것을 알았을 때 수행했어야 하는 모든 작업은npm update
모든 패키지를 업데이트하는 명령입니다.
중요:HttpClientModule
는 Angular 4.3.0 이상용입니다.자세한 내용은 @Maximus의 의견과 @Pengy의 답변을 확인하십시오.
Original answer:
.HttpClient
모듈이 아닌 구성 요소/서비스에 포함됩니다.를 가져오는 경우HttpClientModule
의 신의에@NgModule
// app.module.ts:
import {NgModule} from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';
// Import HttpClientModule from @angular/common/http
import {HttpClientModule} from '@angular/common/http';
@NgModule({
imports: [
BrowserModule,
// Include it under 'imports' in your application module
// after BrowserModule.
HttpClientModule,
],
})
export class MyAppModule {}
그래서 변화.
constructor(private httpClient: HttpModule) {}
로.
constructor(private httpClient: HttpClient) {}
문서에 기재된 바와 같이
그러나 HttpModule을 가져왔으므로
당신은 주사를 놓을 필요가 있습니다.constructor(private httpClient: Http)
@Maximus가 댓글에, @Pengy가 이 답변에 언급한 것처럼.
그리고 그고차이대자내세은용한한의 자세한 하십시오.HttpModule
그리고.HttpClientModule
이 답변을 확인합니다.
중요 업데이트:
HttpModule
그리고.Http
@angular/http
Angular V5 이후로 더 이상 사용되지 않습니다. 를 사용해야 합니다.HttpClientModule
그리고.HttpClient
@angular/common/http
대신 CHANGELOG를 참조하십시오.
**@4.3.0 이전 Angular 버전의 경우 주입해야 합니다.Http
@angular/http
,그리고.HttpModule
이는 NgModule의 가져오기 배열에서 가져오기 위한 것입니다.
import {HttpModule} from '@angular/http';
@NgModule({
...
imports: [HttpModule]
})
입http
요소 또는 에 있습니다.
import { Http } from '@angular/http';
constructor(private http: Http) {}
(포함) 4.3.0 이후의 Angular 버전의 경우 다음을 사용할 수 있습니다.HttpClient
@angular/common/http
에 Http
@angular/http
▁to를 가져오는 것을 잊지 마세요.HttpClientModule
당신의 시간에NgModule
의 가져오기 배열이 먼저입니다.
@econax의 답변을 참조하십시오.
참고: 이것은 @angular/http용이지, 질문된 @angular/common/http용이 아닙니다!
이러한 방식으로 가져오기만 하면 완벽하게 작동합니다.
// Import HttpModule from @angular/http
import {HttpModule} from '@angular/http';
@NgModule({
declarations: [
MyApp,
HelloIonicPage,
ItemDetailsPage,
ListPage
],
imports: [
BrowserModule,
HttpModule,
IonicModule.forRoot(MyApp),
],
bootstrap: [...],
entryComponents: [...],
providers: [... ]
})
그런 다음 service.ts를 다음과 같이 구성합니다.
constructor(private http: Http) { }
getmyClass(): Promise<myClass[]> {
return this.http.get(URL)
.toPromise()
.then(response => response.json().data as myClass[])
.catch(this.handleError);
}
제가 문제가 되었던 angular 5에서 http를 사용하고 있었습니다.Httpclient를 사용하여 문제를 해결했습니다.
자동 가져오기에 주의하십시오. 내 HTTP_INTERCEPTORS는 다음과 같이 자동 가져오기되었습니다.
import { HTTP_INTERCEPTORS } from '@angular/common/http/src/interceptor';
대신에
import { HTTP_INTERCEPTORS } from '@angular/common/http';
이 오류를 야기한 것은
여기에 있는 답들은 다시 한번 구식입니다.이 문제를 해결하기 위해 저는 다음을 수행해야 했습니다.
import { HttpClient, HttpClientModule } from '@angular/common/http';
...
@NgModule({
imports: [
HttpClientModule
],
declarations: [],
providers: [
HttpClient
],
내부의 이 모든 것app.module.ts
이것은 각 11에 대한 것입니다.
가져와야 합니다.http
부터@angular/http
서비스 중:
import {Http} from '@angular/http';
constructor(private http: http) {} // <--Then Inject it here
// now you can use it in any function eg:
getUsers() {
return this.http.get('whateverURL');
}
Ionic 3과 Angular 5를 사용하는 모든 사용자에 대해 동일한 오류가 팝업되었고 여기에서 해결책을 찾지 못했습니다.하지만 저는 저에게 효과적인 몇 가지 방법을 찾았습니다.
재생산 단계:
- npm 설치 - g cordova 이온성
- ionic 시작 myApp 탭
- cd myApp
- cd node_http/sys/common(http 모듈이 존재하지 않음).
ionic:(터미널/게이트웨이 프롬프트에서 이온 정보 실행) 버전을 확인하고 최신 버전인지 확인합니다.패키지의 각 버전과 패키지도 확인할 수 있습니다.프로젝트의 json 폴더.
종속성과 패키지를 확인하고 코르도바를 설치했습니다.원자를 다시 시작하면 오류가 사라집니다.이것이 도움이 되길 바랍니다!
다음을 참조하십시오. http: @angular/common/http 대신 @angular/http를 사용합니다.
종속성을 추가하고 이 오류를 수신하는 경우
npm ERR! 코드 ERESOLVE npm ERR! ERESOLVE가 종속성 트리 npm ERR! npm ERR!해결 중: marriumonial-ui@0.0.0 npm ERR!루트 프로젝트 npm ERR! node_modules/@angular/core npm ERR! @angular/core@"^14.2.0"을 찾았습니다. npm ERR!종속성을 확인할 수 없습니다. 루트 프로젝트 npm ERR! neer @angular/http@7.2.16 node_modules/@angular/http npm ERR! @angular/http@"7.2.16"에서 npm ER! 피어 @angular/core@"7.2.16"업스트림 종속성 충돌을 수정하거나 --force 또는 --legacy-peer-depnpm ERR!을 사용하여 npm ERR! 이 명령을 다시 시도하여 잘못된 종속성 확인을 수락합니다.npm ERR! npm ERR! npm ERR!전체 보고서는 다음을 참조하십시오. npm ERR!C:\사용자\DELL\AppData\Local\nnpm-cache_logs\2023-01-05T17_55_53_622Z-eresolve-report.txt
npm ERR!이 실행에 대한 전체 로그는 npm ERR!에서 확인할 수 있습니다.
C:\사용자\DELL\AppData\Local\nnpm-cache_logs\2023-01-05T17_55_53_622Z-debug-0.log
실행을 실행하여 캐시를 강제로 지울 수 있습니다.npm cache clean --force
언급URL : https://stackoverflow.com/questions/45207615/cannot-find-the-angular-common-http-module
'programing' 카테고리의 다른 글
데이터 테이블을 Excel 워크시트에 덤프하는 속도를 높이는 방법은 무엇입니까? (0) | 2023.08.15 |
---|---|
mysql 테이블에서 열 크기를 가져오는 방법 (0) | 2023.08.15 |
jQuery를 사용하지 않고 rails-ujs Rails.ajax POST 호출로 JSON 데이터를 어떻게 전송합니까? (0) | 2023.07.26 |
Eclipse Juno에 Marketplace 플러그인 (0) | 2023.05.07 |
Excel DataReader를 사용하여 특정 셀에서 시작하는 Excel 데이터 읽기 (0) | 2023.05.07 |