[ts] Property 'subscribe' does not exist on type '(res: any) => any'

Ionic Framework ionic-v3
1

Hi guys,

I’m working on a http provider. The issue is with the subscribe module after mapping the json response.
Here is the code for the provider and a screenshot:

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


/*
  Generated class for the PostsProvider provider.

  See https://angular.io/guide/dependency-injection for more info on providers
  and Angular DI.
*/
@Injectable()
export class PostsProvider {
  data: any = null;

  constructor(public http: HttpClient) {
    console.log('Hello PostsProvider Provider');
    // this.load();
  }

  load() {
    if (this.data) {
      // already loaded data
      return Promise.resolve(this.data);
    }

    // don't have the data yet
    return new Promise(resolve => {
      // We're using Angular HTTP provider to request the data,
      // then on the response, it'll map the JSON data to a parsed JS object.
      // Next, we process the data and resolve the promise with the new data.
      this.http.get('https://randomuser.me/api/?results=10')
        .map((res => res.json())
        .subscribe(data => {
          // we've got back the raw data, now generate the core schedule data
          // and save the data for later reference
          this.data = data.results;
          resolve(this.data);
        }));
    });
  }

}

image
image.png1366×768 91.4 KB

Screenshot (8)
Screenshot (8).png1366×768 112 KB

I’m new to ionic and still learning. I’ve been following tutorials but now i seem to be stuck. Ive tried looking at posts from this and other forums but none have worked for me. Anyone please help. I’m sure its just a small error but it’s huge when you’re learning.

2

Maybe a typing mistake, shouldn’t one parenthesis be removed?

.map(res => res.json())

or

.map((result: Response)=> res.json())
1 Like
3

I removed the parenthesis and this is what i got:

Screenshot (9)
Screenshot (9).png1366×768 90.1 KB

4

Then the 2nd solution I mentioned above:

.map((result: Response)=> res.json())
1 Like
5

Wait!

Just noticed now, you are using the new http client

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

The you could delete the .map at all, it isn’t needed anymore

“old” HttpModule:

this.http.get('https://randomuser.me/api/?results=10')
    .map((res : Response) => res.json())
    .subscribe(data => {
      this.data = data.results;
      resolve(this.data);
    }));

“new” HttpClientModule:

 this.http.get('https://randomuser.me/api/?results=10')
    .subscribe(data => {
      this.data = data.results;
      resolve(this.data);
    }));

or with params (?)

 let params: HttpParams = new HttpParams();
params = params.set('results', 10);

this.http.get('https://randomuser.me/api/, {params: params})
    .subscribe(data => {
      this.data = data.results;
      resolve(this.data);
    }));
1 Like
6

Thanks.
Dont i need it to get the json data or something?

Here’s what happens when i remove it:

Screenshot (11)
Screenshot (11).png1366×768 84.8 KB

7

That’s a typescript error displayed from your editor I guess, no?

When you set a type or any to the results, do the error still pop?

this.http.get('https://randomuser.me/api/?results=10')
.subscribe((data:any) => {
  this.data = data.results;
  resolve(this.data);
}));

here an example from my app:

let params: HttpParams = new HttpParams();
params = params.set('limit', '1');
params = params.append('another_param', '1');

this.httpClient.get('https://....', {params: params})
            .subscribe((results: Something[]) => {
                resolve(results);
            }, (errorResponse: HttpErrorResponse) => {
                reject(errorResponse);
            });

where Something is a class or an interface like:

export class Something {
    id: string;
}
2 Likes
8

After setting the type there’s no errors. But the app isn’t displaying the data i want it to. It might be another issue. I’ll get back. Thanks so much

1 Like