HTTP-запрос Ionic 2 не работает - Angular 2

Привет, я пытаюсь сделать простой запрос Http GET, но не могу заставить его работать в бета-версии ionic v2...

вот мой app.js:

import {App, Platform} from 'ionic-angular';
import {TabsPage} from './pages/tabs/tabs';
import {HTTP_BINDINGS} from 'angular2/http';


@App({
  template: '<ion-nav [root]="rootPage"></ion-nav>',
  providers: [HTTP_BINDINGS],
  config: {} // http://ionicframework.com/docs/v2/api/config/Config/
})
export class MyApp {
  static get parameters() {
    return [[Platform]];
  }

  constructor(platform) {
    this.rootPage = TabsPage;

    platform.ready().then(() => {

    });
  }
}

и это моя страница1.js:

import {Page} from 'ionic-angular';
import {Http} from 'angular2/http';


@Page({
  templateUrl: 'build/pages/page1/page1.html'
})

export class Page1 {
    constructor(http:Http) {

        this.mget = http.get("https://httpbin.org/ip")
        .subscribe(data => {
            var alert = Alert.create({
                title: "Your IP Address",
                subTitle: data.json().origin,
                buttons: ["close"]
            });
            this.nav.present(alert);
        }, error => {
            console.log(JSON.stringify(error.json()));
        });
    }
}

При добавлении http:Http в конструктор -> конструктор (http:Http) все приложение становится пустым в браузере... И я получаю сообщение об ошибке в консоли:

Ошибка: не удается найти модуль "../page1/page1"

Я также пробовал это в Page1.js:

export class Page1 {
    constructor() {

    }

    makeGetRequest() {
        this.http.get("https://httpbin.org/ip")
        .subscribe(data => {
            var alert = Alert.create({
                title: "Your IP Address",
                subTitle: data.json().origin,
                buttons: ["close"]
            });
            this.nav.present(alert);
        }, error => {
            console.log(JSON.stringify(error.json()));
            console.log('yolo')
            alert('hello');
        });
    }
}

а затем вызовите makeGetRequest() (щелчок) в page1.html, но он возвращает следующие исключения:

ИСКЛЮЧЕНИЕ: ошибка при оценке "клика"

ИСХОДНОЕ ИСКЛЮЧЕНИЕ: TypeError: this.http is undefined

пожалуйста помоги! :)

-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-.-

ЭТО РЕШЕНИЕ:

страница1.js:

import {Page} from 'ionic-angular';
import {Http} from 'angular2/http';

@Page({
  templateUrl: 'build/pages/page1/page1.html'
})

export class Page1 {
     static get parameters(){
       return [Http];
       }
    constructor(http) {
        this.http = http;

        this.mget = this.http.get("https://httpbin.org/ip")
        .subscribe(data => {
            console.log(data);
        }, error => {
            console.log('faild');
        });
    }
}

приложение.js:

import {App, Platform} from 'ionic-angular';
import {TabsPage} from './pages/tabs/tabs';
import { HTTP_PROVIDERS } from 'angular2/http';


@App({
  template: '<ion-nav [root]="rootPage"></ion-nav>',
  providers: [HTTP_PROVIDERS],
  config: {} // http://ionicframework.com/docs/v2/api/config/Config/
})
export class MyApp {
  static get parameters() {
    return [[Platform]];
  }

  constructor(platform) {
    this.rootPage = TabsPage;

    platform.ready().then(() => {

    });
  }
}

person Christer    schedule 02.03.2016    source источник


Ответы (2)


Пожалуйста, попробуйте это

export class Page1 {
     static get parameters(){
       return [Http];
       }
    constructor(http) {
        this.http = http;
        this.mget = this.http.get("https://httpbin.org/ip")
        .subscribe(data => {
            var alert = Alert.create({
                title: "Your IP Address",
                subTitle: data.json().origin,
                buttons: ["close"]
            });
            this.nav.present(alert);
        }, error => {
            console.log(JSON.stringify(error.json()));
        });
    }
}

Я бы порекомендовал вам написать запрос на получение внутри отдельной службы и внедрить его на свою страницу.

Также взгляните на это - http://tphangout.com/?p=113

Там даны подробные и простые инструкции по выполнению простого запроса GET из приложения Ionic 2.

person Raja Yogan    schedule 02.03.2016

Я считаю, что вам нужно import { HTTP_PROVIDERS } from 'angular2/http'; в app.js вместо HTTP_BINDINGS и изменить providers: [HTTP_BINDINGS] на providers: [HTTP_PROVIDERS]

См. документацию по Angular2.

person jboothe    schedule 02.03.2016
comment
все еще получаю ошибку: ИСХОДНОЕ ИСКЛЮЧЕНИЕ: TypeError: this.http не определено - person Christer; 03.03.2016
comment
Попробуйте сделать http приватным: constructor(private http:Http) {... - person jboothe; 03.03.2016
comment
Вы вставили <script src="../node_modules/angular2/bundles/http.dev.js"></script> на главную страницу? - person jboothe; 03.03.2016