2016-11-03 8 views
2

habe ich ionic 2 RC0 mit Versprechen zu Abrufen von Daten aus dem Server verwendet, aber mein Problem Ich habe immer einige Daten in jeder Anforderung, weil Versprechen die Daten.Ionic 2 Versprechen Verschiedene Daten vom Server

Also meine Frage ist:

, wie dieses Problem unterschiedliche Daten mit Versprechen jede Anfrage auflösen kann? irgendein Vorschlag?

Mein Code:

Api.ts

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

@Injectable() 
export class Api { 
    storeData: any; 

    constructor(public http: Http) { 
    this.storeData = null; 
    } 

    getData(id) { 
    if (this.storeData) { 
     return Promise.resolve(this.storeData); 
    } 
    return new Promise(resolve => { 
     this.http.get(URL+'?id='+id) 
     .map(res => res.json()) 
     .subscribe(data => { 
      this.storeData = data.products; 
      resolve(this.storeData); 
     }); 
    }); 
    } 

} 

In Home i wie unten Code, um die Daten von api gelesen haben:

Home.ts

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

@Injectable() 
export class Home { 

    constructor() {} 

    getDataFromApi() { 
    let me = this; 
    me.api.getData(id) 
    .then(data => { 
     if (data != null) { 
     for (let i = 0; i < data.length; i++) { 
      console.log(JSON.stringify(data)); 
     } 
     }else { 
     this.noProducts = 'There are no products matching the selection.'; 
     } 
    }); 
    } 

} 

Example :

wenn Anruf getDataFromApi(12); Re wandte sich Daten wie {{name:bla bla, title: bla bla}}

dann die Funktion wieder, wenn Anruf mit verschiedenen id wie: 10

getDataFromApi(10); Rückkehr der einige Daten wie {{name:bla bla, title: bla bla}}

Mit dem obigen Code, erhalte ich ein Array mit den Daten enthält, werden alle Daten sind gleich. Gleicher Titel, Inhalt, Thumbnail und alles.

Antwort

1

Das Problem bezieht sich nicht auf Versprechungen. Die Sache ist, dass wenn Sie den Dienst das erste Mal anrufen, Sie die Anfrage machen und dann speichern Sie die Antwort in der this.storeData Eigenschaft. Also, wenn Sie wieder den Dienst aufrufen, auch mit einem anderen Parameter, diese Zeilen Code ausgeführt werden:

if (this.storeData) { 
    return Promise.resolve(this.storeData); 
} 

und die Anforderung wird nicht an den Server gesendet. Deshalb gibt der Dienst immer die Antwort zurück, die in der ersten Anfrage erhalten wurde. Um das zu vermeiden, ändern Sie einfach den Service wie folgt aus:

import { Injectable } from '@angular/core'; 
import { Http } from '@angular/http'; 
import 'rxjs/add/operator/map'; 
import 'rxjs/add/observable/from'; 
import 'rxjs/add/operator/toPromise' // <- I've added this import!! 
import 'rxjs/Rx'; 

@Injectable() 
export class Api { 

    constructor(public http: Http) { 
    } 

    getData(id) { 
     return this.http.get(URL+'?id='+id) 
     .map(res => res.json()) 
     .map(data => data.products) // You only return the .products from the server response right? 
     .toPromise(); // <- you don't need to create a new promise, use the toPromise() method instead 
    } 

} 
+0

In 'Home.ts' die' getDataFromApi() 'Funktion ein Fehler aufgetreten ist' Property (dann) existiert nicht auf Typ (void) '; irgendein Vorschlag ? – mahmoudismail

+0

Entschuldigung, ich habe die 'Rückkehr' vergessen ... Ich habe die Antwort aktualisiert :) – sebaferreras

+0

danke für deine Antwort, aber ein anderer Fehler ist aufgetreten :),' Fehler: Kann Modul "rxjs/operator/add/toPromise" nicht finden ' – mahmoudismail