Угловой 2 Сервис с использованием Fetch and Promise

Question

Я запускаю Angular 2 beta.

Я пытаюсь создать службу http, используя выборку, которая реализует обещания. Вот то, что я до сих пор:

HttpService.ts:

@Injectable() 
export class HTTPService { 

    save(url: string, jsonPayload: JsonPayload): any { 

     window.fetch(url, { 
      method: "POST", 
      headers: { 
         "Accept": "application/json", 
         "Content-Type": "application/json" 
      }, 
      body: jsonPayload 
     }) 
     .then(status) 
     .then(json) 
     .then((response: any) => { 
      this.response = response; 

      return Promise.resolve(this.response); 
     }) 
     .catch((error) => { 
      console.log(error.message); 

      return error.message; 
     }); 
    } 
} 

Вот сервис потребляя класс:

export class ConsumingComponent { 
    constructor(private _httpService: HTTPService) { 
       ... 
    } 

    getSampleStuff() { 
     this._httpService 
      .save("http:sample.com/sample/stuff", this.jsonPayload) 
      .then(response => this.response = response); 

     this.sampleStuffModel = this.response; 
    } 
} 

Мое намерение вызвать веб-службу асинхронно.
Это, как я понимаю технологию:

• Инициализировать обещание в службе
• Вводить службу в класс потребляющего
• Добавить «.Затем (...)» в классе потребляющего , результаты обратного вызова здесь.

Я попытался установить член класса («this.response») на ответ («ответ»).

Когда я выполняю это обещание, ответ имеет значение null или undefined.

Я предполагаю, что реализация функции разрешения является источником проблемы. Свернуть все window.fetch() в решении()?

Answer 1

Возвращенные значения не пропускают всю цепочку при использовании обещаний.

window.fetch(...) 
    .then(status) // only status function will have the response 
    .then(json) 

Может быть, я ошибаюсь, но, кажется, не являются функциями status и json. Что вы здесь делаете?

Ваш сервисный код не хватает возврата к работе, как и ожидалось (я также удалил status и json):

@Injectable() 
export class HTTPService { 
    save(url: string, jsonPayload: JsonPayload): any { 
     // if you don't return anything, how the consumer will know it's a promise? 
     return window.fetch(url, { 
      method: "POST", 
      headers: { 
       "Accept": "application/json", 
       "Content-Type": "application/json" 
      }, 
      body: jsonPayload 
     }) 
     // do you really need to store the response into the service? 
     // .then((response: any) => { 
     // this.response = response; 
     // return Promise.resolve(this.response); 
     // }) 
     .catch((error) => { 
      console.log(error.message); 
      // if you return error.message here, the consumer won't know there is a problem 
      // you need to rethrow the error so it can be catched by the consumer 
      throw error; 
     }); 
    } 
} 

windows.fetch() уже обещание, не обернуть его в resolve().