Need some help with HttpClient / map

Ionic Framework ionic-v3
1 
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';

@Injectable()
export class RestProvider {

  baseUrl:string = "https://localhost.local/api/v1";

  constructor(private httpClient: HttpClient) {}
    
  //Get latest events from API
  public getEvents(): Observable<Event[]> {
    return this.httpClient
      .get(this.baseUrl + '/events')
      .map(events => {
        return events.map((event) => new Event(event));
      })
      .catch((err)=>{
          console.error(err);
          return Observable.throw(err);
      });
  }

  public getEventById(eventId: number): Observable<Event> {
    return this.httpClient
      .get(this.baseUrl + '/events/' + eventId)
      .map(response => {
          return new Event(response);
      })
      .catch((err)=>{
          console.error(err);
          return Observable.throw(err);
      });
  }  
}

export class Event {
  id: number;
  calendar_id: number;
  title: string;
  slug: string;
  excerpt: string;
  content: string;
  multidate: string;
  allday: number;
  grouped: number;
  event_gty: number;
  event_price: number;
  location_name: string;
  location_address: string;
  contact_email: string;
  constructor(values: Object = {}) {
       Object.assign(this, values);
  }
}

return events.map((event) => new Event(event));

map has a TS error "Property ‘map’ does not exist on type ‘object’.

I’m sure this is a complete newb question, so any help is greatly appreciated!

2

No .map needed with the “new” HttpClientModule, remove it

Check my following answer there, this simple query works for me in prod

https://forum.ionicframework.com/t/ionic-with-angular-5-and-new-httpclient/116846/2?u=reedrichards&source_topic_id=116843

P.S.: If you want to return a observable you could to

public getEvents(): Observable<Object> {
   return this.httpClient.get(this.baseUrl + '/events');
}
3

Thank you!

What’s the difference between an observable and subscribe?

1 Like
4

An Observable emits a stream. A subscription listens to an Observable.

1 Like
5

You subscribe to an observable :wink:

6

Saweeeet!

It worked like a charm too. You are awesomesauce!

1 Like