Http in Ionic 3.0.1

tutorials
1

Hi All,

Since there’s no tutorial yet on the breaking changes affecting Ionic v3’s use of angular/http, I hope this will help anyone with the following errors:

HttpModule is not defined
or
Uncaught (in promise): Error: No provider for Http!

Here are the changes you need to make to use native Http in Ionic v3…

app.module.ts

import { HttpModule } from '@angular/http';
...
@NgModule({
    ...
    imports: [
        BrowserModule,
        HttpModule,
        IonicModule.forRoot(MyApp),
    ],
...

MyPage.ts

import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/timeout';
...
constructor(public navCtrl: NavController, public navParams: NavParams, public http: Http) {
    }
...

ETPhoneHome() {
        let path = 'http://localhost:8080/foo';
        let encodedPath = encodeURI(path);
        let timeoutMS = 10000;

        this.http.get(encodedPath)
            .timeout(timeoutMS)
            .map(res => res.json()).subscribe(data => {
                let responseData = data;
                console.log(responseData);
            },
            err => {
                console.log('error in ETPhoneHome');
            });
    }

And that’s it!

Thanks,
Ryan

3 Likes
2

It’s good to clarify this, however I feel it’s important to point out that this info is also in the Ionic 3.0.0 changelog.

1 Like
3

How about that! :slight_smile:
Well considering how many people are having trouble with it, and the lack of a tutorial…

Thanks for the changelog link. :slight_smile:

1 Like
4

Certainly! I didn’t mean to disparage your contribution. I just thought it’d be worthwhile to point to the changelog for future reference when it comes to new releases.

1 Like
5

Hi @ryanlogsdon,

I tried to use your example but I am facing this error :

Property ‘timeout’ does not exist on type ‘Observable’

Do you have an idea of the cause ?

6

Probably an artifact of how you are importing Observable. An additional import for timeout may be needed.

7

thanks alot ! it solved my problem.