[Angular7] http서비스 오류 해결

모의 DB서비스 사용해서 데이터 끌어오는 컴포넌트를 만들어보려고 하는데 자꾸 http 서비스 관련 에러가 떠서 ㅠㅠ

처음에 앵귤러 설치해서 공부했을때는 잘 됐는데 앵귤러 최신버전으로 업그레이드를 한게 뭔가 문제가 되는 것 같다.

관련 에러 찾아보니 원래 http관련 서비스가 @angular/http에 있었는데 앵귤러7에서는 @angular/common/http이고 관련 서비스들의 클래스명이 달라서 에러 메세지가 뜬다.

​

오류가 나는 파일 경로는 컴파일링에서 나타나는 오류에 해당 파일이 뜨니까 "alt+클릭"하여 해당 파일 오픈한다.(vs code작업시)

오류 메시지에 해당 오류를 가지고 있는 파일 경로가 뜬다. 해당 경로 알트 클릭!

 

http-backend.service.d.ts 파일레서 수정 필요한 영역

 

위에 영역들이 뭔가 문제인 것 같은데 자동완성 기능으로 명칭 수정하고 난리 쳐봤자 에러메세지가 해결되지 않는다 ㅠ_ㅠ

몇시간을 서칭했는지 모르겠다.

버전이 맞지않아서 뭔가 설치된 http파일들과 앵귤러버전과 뭔가 충돌이 있는거 같은데 내가 하나하나 해결하자니 점점 답이 없어졌당 ㅠㅠㅠㅠㅠㅠㅠㅠ

아래 주소에 오류메세지가 떴던 파일 최신버전인 것 같다. 복붙하니 잘된다!

https://github.com/angular/in-memory-web-api/blob/master/http-client-backend.service.d.ts

​

또 index.d.ts파일에서 머시 중복 export 된다고 컴파일링 오류 메세지가 뜨길래

해당 파일 들어가서 쪼기 저 영역 주석처리 해줬다.

즨짜 지이이이이인짜 컴파일링 메세지에 빨간줄 하나도 안뜬다! 하!!! 힘들었다!!

 

 

index.d.ts 파일 추가 수정

 

 

http관련하여 정리되어있는 공식 사이트.

https://angular.io/guide/http

 

Angular Docs

Version 6 of Angular Now Available! Learn More Features Docs Resources Events Blog Getting Started Tutorial Fundamentals Architecture Components & Templates Forms Observables & RxJS Bootstrapping NgModules Dependency Injection HttpClient Routing & Navigation Animations Techniques Setup & Deployment ...

angular.io

​

// 190109 추가

앵귤러6 http 작업 튜토리얼!

많이도움이될거같다.

 

Angular Http — Angular 6 HttpClient Tutorial | Techiediaries

How to do HTTP in Angular ? In this tutorial we'll be seeing a detailed guide with example using the new @angular/common/http module. In this tutorial, we are going to learn how to use HttpClient by example in Angular 6 . We'll see how to send http post,get, put and delete requests to a back-end ser...

www.techiediaries.com

https://www.techiediaries.com/angular-http-client/