'지도'속성이 '관찰 가능'유형에 없습니다.

'지도'속성이 '관찰 가능'유형에 없습니다.'

---

Angular에서 API를 호출하려고 하는데이 오류가 발생합니다.

Property 'map' does not exist on type 'Observable<Response>'

이 비슷한 질문에 대한 답변이 내 문제를 해결하지 못했습니다 : Angular 2 베타 17 : 'Observable <Response>'유형에 'map'속성이 없습니다 .

Angular 2.0.0-beta.17을 사용하고 있습니다.

---

map연산자 를 가져와야합니다 .

import 'rxjs/add/operator/map'

또는 더 일반적으로 :

import 'rxjs/Rx';

---

참고 : RxJS 6.x.x이상 버전의 경우 아래 코드 스 니펫에 표시된대로 파이프 가능 연산자를 사용해야합니다.

import { map } from 'rxjs/operators';
import { HttpClient } from '@angular/common/http';

// ...
export class MyComponent {
  constructor(private http: HttpClient) { }
  getItems() {
    this.http.get('https://example.com/api/items').pipe(map(data => {})).subscribe(result => {
      console.log(result);
    });
  }
}

이는 RxJS 팀이 사용에 대한 지원을 제거했기 때문에 발생합니다 . 자세한 정보는 RxJS 변경 로그 의 주요 변경 사항 을 참조하십시오 .

변경 로그에서 :

operator : 파이프 가능한 연산자는 다음과 같이 rxjs에서 가져와야 import { map, filter, switchMap } from 'rxjs/operators';합니다. 수입품이 없습니다.

---

내 솔루션이 여기에 없기 때문에 이것을 다시 방문하십시오.

rxjs 6.0과 함께 Angular 6을 실행 중이며이 오류가 발생했습니다.

내가 고치기 위해 한 일은 다음과 같습니다.

나는 바꿨다

map((response: any) => response.json())

단순히 :

.pipe(map((response: any) => response.json()));

여기에서 수정 사항을 찾았습니다.

https://github.com/angular/angular/issues/15548#issuecomment-387009186

희망이 도움이됩니다.

---

프로젝트의 코드 대 터미널 에이 명령을 쓰고 프로젝트를 다시 시작하십시오.

npm install rxjs-compat

다음 map을 작성 하여 연산자 를 가져와야합니다 .

import 'rxjs/add/operator/map';

---

Observable을 가져 오기 때문에 Angular 2.0.1과 동일한 문제가 발생했습니다.

import { Observable } from 'rxjs/Observable';

대신이 경로에서 Observable을 가져올 때 발생하는 문제를 해결합니다.

import { Observable } from 'rxjs';

---

각도 7v

변화

import 'rxjs/add/operator/map';

에

import { map } from "rxjs/operators"; 

과

 return this.http.get('http://localhost/ionicapis/public/api/products')
 .pipe(map(res => res.json()));

---

rxjs 6에서 맵 연산자 사용법이 변경되었습니다. 이제 이와 같이 사용해야합니다.

import { map } from 'rxjs/operators';
myObservable
  .pipe(map(data => data * 2))
  .subscribe(...);

참조 https://www.academind.com/learn/javascript/rxjs-6-what-changed/#operators-update-path

---

터미널에 입력하여 rxjs-compat를 설치하십시오.

npm install --save rxjs-compat

그런 다음 가져 오기 :

import 'rxjs/Rx';

---

최신 Angular 7. *. * 에서는 다음과 같이 간단하게 시도 할 수 있습니다.

import { Observable, of } from "rxjs";
import { map, catchError } from "rxjs/operators";

그런 다음 다음 methods과 같이 사용할 수 있습니다 .

   private getHtml(): Observable<any> {
    return this.http.get("../../assets/test-data/preview.html").pipe(
      map((res: any) => res.json()),
      catchError(<T>(error: any, result?: T) => {
        console.log(error);
        return of(result as T);
      })
    );
  }

자세한 내용은 이 데모 를 확인 하십시오.

---

제 경우에는지도와 약속 만 포함하면 충분하지 않습니다.

import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise';

공식 문서 권장 사항에 따라 여러 rxjs 구성 요소를 가져 와서이 문제를 해결했습니다 .

1) 하나의 app / rxjs-operators.ts 파일에서 명령문을 가져옵니다.

// import 'rxjs/Rx'; // adds ALL RxJS statics & operators to Observable

// See node_module/rxjs/Rxjs.js
// Import just the rxjs statics and operators we need for THIS app.

// Statics
import 'rxjs/add/observable/throw';

// Operators
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/debounceTime';
import 'rxjs/add/operator/distinctUntilChanged';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/switchMap';
import 'rxjs/add/operator/toPromise';

2) 서비스에서 rxjs-operator 자체를 가져옵니다.

// Add the RxJS Observable operators we need in this app.
import './rxjs-operators';

---

나는 같은 문제가 있었고, 이전 버전의 typescript가있는 Visual studio 2015를 사용하고있었습니다.

확장을 업그레이드 한 후 문제가 해결되었습니다.

다운로드 링크

---

I am using Angular 5.2 and when I use import 'rxjs/Rx'; it throws me the following lint error: TSLint: This import is blacklisted, import a submodule instead (import-blacklist)

See the screenshot below:

SOLUTION: Solved it by importing only the operators that I needed. Example follows:

import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';

So the fix would be to import specifically only the necessary operators.

---

First of all run installation as below:

npm install --save rxjs-compat@6

Now you need to import rxjs in service.ts:

import 'rxjs/Rx'; 

Voila! The problem has been fixed.

---

I tried all the possible answers posted above none of them worked,

I resolved it by simply restarting my IDE i.e., Visual Studio Code

May it helps someone.

---

I too faced the same error. One solution that worked for me was to add the following lines in your service.ts file instead of import 'rxjs/add/operator/map':

import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';

For an example, my app.service.ts after debugging was like,

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';

@Injectable()
export class AppService {
    constructor(private http: HttpClient) {}
    getData(): Observable<any> {
        return this.http.get('https://samples.openweathermap.org/data/2.5/history/city?q=Warren,OH&appid=b6907d289e10d714a6e88b30761fae22')
        .pipe(map(result => result));
    }
}

---

If after importing import 'rxjs/add/operator/map' or import 'rxjs/Rx' too you are getting the same error then restart your visual studio code editor, the error will be resolved.

---

Simply install rxjs-compat to solve the problem

npm i rxjs-compat --save-dev

And import it like below

import 'rxjs/Rx';

---

import { map } from "rxjs/operators";

getGetFunction(){
this.http.get('http://someapi')
.pipe(map(res => res));
}

getPostFunction(yourPara){
this.http.get('http://someapi',yourPara)
.pipe(map(res => res));
}

In above function you can see i didn't use res.json() since im using HttpClient. It applies res.json() automatically and returns Observable (HttpResponse < string>). You no longer need to call this function yourself after angular 4 in HttpClient.

---

for all those linux users that are having this problem, check if the rxjs-compat folder is locked. I had this exact same issue and I went in terminal, used the sudo su to give permission to the whole rxjs-compat folder and it was fixed. Thats assuming you imported

import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch'; 

in the project.ts file where the original .map error occurred.

---

Use the map function in pipe function and it will solve your problem. You can check the documentation here.

this.items = this.afs.collection('blalal').snapshotChanges().pipe(map(changes => {
  return changes.map(a => {
    const data = a.payload.doc.data() as Items;
    data.id = a.payload.doc.id;
    return data;
  })
})

---

npm install rxjs@6 rxjs-compat@6 --save

---

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

  @Injectable({
  providedIn: 'root'
  })
  export class RestfulService {

  constructor(public http: Http) { }

 //access apis Get Request 
 getUsers() {
 return this.http.get('http://jsonplaceholder.typicode.com/users')
  .map(res => res.json());
  }

 }

run the command

 npm install rxjs-compat 

I just import

 import 'rxjs/add/operator/map';

restart the vs code, issue solved.

---

The angular new version does not support .map you have to install this through cmd npm install --save rxjs-compat via this you can enjoy with old technique . note: don't forget to import these lines.

import { Observable, Subject } from 'rxjs';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';

참고URL : https://stackoverflow.com/questions/37208801/property-map-does-not-exist-on-type-observableresponse