CODEWITHSUNDEEP
javascriptobjectrxjsobservableangular6
user1490238
user1490238

Reputation: 261

Angular6 map doesn't exist

This is my first project in angular 6. I want to use chart.js in my project. I installed chart.js and follow the link https://coursetro.com/posts/code/126/Let's-build-an-Angular-5-Chart.js-App---Tutorial

But I am getting error in my service.ts file. It is throwing error "[ts] Property 'map' does not exist on type 'Observable'."

My code for the service is

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

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

  constructor(private _http: HttpClient) { }
  dailyForecast() {
    return this._http.get("http://samples.openweathermap.org/data/2.5/history/city?q=Warren,OH&appid=b6907d289e10d714a6e88b30761fae22")
      .map(result => result);
  }

}

So I am requesting you to help me to solve that issue. Thank you.

Upvotes: 1

Views: 222

Answers (2)

JeanPaul A.
JeanPaul A.

Reputation: 3724

A bootstrapped application from CLI V6 uses rxjs 6. Rxjs6 use pipeable operators hence why that error is thrown.

The code which you have referenced uses an earlier version of rxjs (probably rxjs 5).

In order for your code to work with rxjs 6 it should be updated as follows

import { map } from 'rxjs/operators';

// Your other code

dailyForecast() {
  return this._http.get(<your url>).pipe(map(result => result)); 
}

Upvotes: 1

Ashiqur Rahman Emran
Ashiqur Rahman Emran

Reputation: 207

According to latest RxJS version they made change that now http request can extend pipe which can take parameters such as 

filter(x => x % 2 === 1), map(x => x + x),catchError(res=>{console.log(res)})

which is imported from

import { Observable, Subject, ReplaySubject, from, of, range } from 'rxjs';
import { map, filter, switchMap , CatchError } from 'rxjs/operators';

So now if you want to use Map, CatchError etc then we need to pass it as the parameter of pipe

 dailyForecast() {
    return this._http.get("http://samples.openweathermap.org/data/2.5/history/city?q=Warren,OH&appid=b6907d289e10d714a6e88b30761fae22")
      .pipe(map(x => console.log(x)),catchError(res=>{console.log(res)}));
  }

Upvotes: 0

Related Questions