angularjs — (Ionic 2) Получение данных от php-сервисов не определено

Question

angularjs — (Ionic 2) Получение данных от php-сервисов не определено

Я новичок в ionic 2 и пытаюсь получить свои данные от php-сервисов, которые я создал для ionic 1. Он работает на ionic 1, но когда я получаю данные от ionic 2, он не определен. Это работает, когда я получаю данные с php-сервера на каком-то веб-сайте (из учебника), но когда я получаю данные с моего локального хоста, они не определены. Это проблема в моем php-коде, или мне нужно изменить свои услуги. Спасибо…

Вот мой PHP-код:

<?php
header('Access-Control-Allow-Origin: *');

$db_name  = 'kuliner';
$hostname = 'localhost';
$username = 'root';
$password = '';$dbh = new PDO("mysql:host=$hostname;dbname=$db_name", $username, $password);$sql = 'SELECT * FROM promo';
$stmt = $dbh->prepare($sql);
// execute the query
$stmt->execute();$result = $stmt->fetchAll( PDO::FETCH_ASSOC );$json = json_encode( $result );
echo $json;
?>

Вот мои услуги:

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

/*
Generated class for the PromoService provider.

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

constructor(public http: Http) {}

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('http://localhost:9999/KY Mobile/Promo/selectPromo.php')
.map(res => res.json())
.subscribe(data => {
this.data = data.results;
resolve(this.data);
});
});
}
}

Моя домашняя страница:

import {Page} from 'ionic-angular';
import {PromoService} from '../../providers/promo-service/promo-service';

@Page({
templateUrl: 'build/pages/home/home.html',
providers: [PromoService]
})
export class Home {

public promos: any;
constructor(public promoService : PromoService) {
this.loadPromo();
};

loadPromo(){
this.promoService.load()
.then(data => {
this.promos = data;
console.log("ABCD" + data);
});
}
}

Мой HTML:

<ion-content padding class="page1">
<ion-list>
<ion-item *ngFor="let promo of promos">
<ion-avatar item-left>
<img src="{{promo.image}}">
</ion-avatar>
</ion-item>
</ion-list>
</ion-content>

Обновить:
Теперь решено, код должен быть this.data = data в PromoService. Спасибо..

0

angular angularjs ionic-framework ionic2 php

Решение

Другие решения

У меня были некоторые проблемы с Promises в Ionic2 / Angular2. Вместо этого вы можете попытаться заменить Обещание Наблюдаемым в вашем сервисе:

return Observable.create(observer => {
this.http.get('http://localhost:9999/KY Mobile/Promo/selectPromo.php').map(res =>res.json()).subscribe(data=>{
observer.next(data)
observer.complete();
});
});

Затем на домашней странице.

loadPromo(){
this.promoService.load().subscribe(data=>{
this.promos = data;
console.log("ABCD" + data);
});
}

0

Источник

Accepted Answer

Если res в

 this.http.get('http://localhost:9999/KY Mobile/Promo/selectPromo.php')
.map(res => res.json())

является undefined тогда вы не получите значение от http.get()

Другие предложения

Ты можешь использовать toPromise лайк

  return this.http.get('http://localhost:9999/KY Mobile/Promo/selectPromo.php')
.map(res => res.json())
.do(data => this.data = data.results);
.toPromise();

или просто вернуть обещание, возвращенное из http.get() и подписаться на сайте вызова

load() {
if (this.data) {
// already loaded data
return Observable.of(this.data);
}
return this.http.get('http://localhost:9999/KY Mobile/Promo/selectPromo.php')
.map(res => res.json())
.do(data => this.data = data.results);
}

а потом просто использовать subscribe() вместо then()

loadPromo(){
this.promoService.load()
.subscribe(data => {
this.promos = data;
console.log("ABCD" + data);
});
}

Смотрите также Как правильно передать результат сетевого вызова Angular 2 Http в RxJs 5?

намек map, do, toPromise, … должны быть импортированы, чтобы стать доступными.

import 'rxjs/add/operator/map';
import 'rxjs/add/operator/do';
import 'rxjs/add/operator/toPromise';

или просто

import 'rxjs/Rx';

0