Arhn - архитектура программирования

Ionic 2 Promise Различные данные с сервера

Я использовал ionic 2 RC0 с promise для получения данных с сервера, но моя проблема — я получаю некоторые данные в каждом запросе, потому что данные обещают.

Итак, мой вопрос:

как можно решить эту проблему с обещанием разных данных при каждом запросе? есть предложения?

Мой код:

Апи.тс

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);
        });
    });
  }

}

На домашней странице я прочитал данные из API, как показано ниже:

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.';
      }
    });
  }

}

Пример :

если вызов getDataFromApi(12); вернул данные типа {{name:bla bla, title: bla bla}}

затем, если снова вызвать функцию с другим id, например: 10

getDataFromApi(10); вернуть некоторые данные, такие как {{name:bla bla, title: bla bla}}

С помощью приведенного выше кода я получаю массив, содержащий данные, все данные одинаковы. Тот же заголовок, содержание, эскиз и все такое.

typescript ionic-framework angular ionic2
03.11.2016

Ответы:


1

Проблема не связана с обещаниями. Дело в том, что при первом вызове службы вы делаете запрос, а затем сохраняете ответ в свойстве this.storeData. Итак, если вы снова вызываете службу, даже с другим параметром, выполняются эти строки кода:

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

и запрос не отправляется на сервер. Вот почему служба всегда возвращает ответ, полученный в первом запросе. Чтобы этого избежать, просто измените сервис следующим образом:

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
  }

}
03.11.2016
  • В Home.ts функции getDataFromApi() появилась ошибка Property (then) does not exist on type (void); любое предложение ? 03.11.2016
  • Извините, я забыл return... Я обновил ответ :) 03.11.2016
  • спасибо за ответ, но появилась другая ошибка :) , Error: Cannot find module "rxjs/operator/add/toPromise" 03.11.2016
  • Не могли бы вы попробовать изменить оператор импорта на import 'rxjs/add/operator/toPromise'; ? извините за столько ошибок, я кодирую в текстовой области SO, так как я не на своем ноутбуке. 03.11.2016
  • Рад, что смог помочь :) 04.11.2016
  • Можете ли вы помочь мне с моей проблемой на stackoverflow.com/questions/40416936/ ionic-2-accordion-list 04.11.2016
    • Новые материалы
    Коллекции публикаций по глубокому обучению
    Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..
    Представляем: Pepita
    Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..
    Советы по коду Laravel #2
    1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..
    Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
    Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..
    3 способа решить квадратное уравнение (3-й мой любимый) -
    1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..
    Создание VR-миров с A-Frame
    Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..
    Демистификация рекурсии
    КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..