Angular2 - TypeError: this.http.get(...).toPromise is not a function 角度2 - 类型错误：this.http.get（...）.toPromise不是一个函数

Question

我尝试跟随angular.io上的教程（Tour the Heroes）， 但我想尝试对一些JSON进行真实的GET请求，代码如下：

  private userUrl = 'https://jsonplaceholder.typicode.com/users';
  constructor(private http: Http) {}

  getUsersHttp(): Promise<User[]> {
    return this.http.get(this.userUrl)
      .toPromise()
      .then(response => response.json().data as User[])
      .catch(this.handleError);
  }

为了提供服务，我只导入了一些基础东西：

import { Injectable }     from '@angular/core';
import { Headers, Http, Response } from '@angular/http';
import { User } from './user';

在 TOH 中，user.ts 基本上是 heroe.ts 的复制品，因此：

export class User {
  id: number;
  name: string;
}

我如何在服务中调用特定的方法： 一开始我尝试了多种方法，但在调试时我只是尝试使用console.log：

如何在服务中调用特定的方法：首先我尝试了多种方法，但是在进行调试时我选择只使用console.log：

 console.log(this.userService.getUsersHttp());

当页面加载时，在控制台上发现多个错误： 第一个是：

异常: TypeError: this.http.get(...).toPromise 不是函数

第二个是：

异常: TypeError: this.http.get(...).toPromise 不是函数BrowserDomAdapter.logError @

服务本身看起来没问题。我在这一行中添加了我的服务 app.module.ts:

providers: [ HTTP_PROVIDERS, UserService ]

如果我直接使用某些函数返回数据(并注释调用getUsertHttp函数)，它就可以正常工作：

  getUsers() {
    return [{'id': 1, 'name': 'User1'}, {'id': 2, 'name': 'User2'}];
  }

我试图描述所有可能重要的内容，如果问题有点长，请原谅。

请问大家，你们能给我一些提示吗？我做错了什么？

- Andurit

---

你能否也粘贴 index.html 和 main.ts？可能在 polyfill 中缺少 core-js 或 es6-shim。 - John Siu

Answer 1

看起来你缺少了这个导入：

import 'rxjs/add/operator/toPromise';

- Stefan Svrkota

---

嗨@Stefan Svrkota，你是对的，我错过了那个导入。无论如何，我会将您的问题标记为正确的，但也许您可以给出任何提示，为什么this.httpUsers未定义？this.userService .getUsersHttp() .then(users => this.httpUsers = users) .catch(error => this.error = error); - Andurit

https://jsonplaceholder.typicode.com/users 返回一个 JSON 数组，而不是一个对象，该对象将具有 .data 成员。 - Philippe Plantier

谢谢你们两个，Philippe说得对。 - Andurit

很高兴你解决了它。 - Stefan Svrkota

奇怪的是，这个导入在前几周对我来说是有效的。然后，最终它停止工作了，天知道为什么。 - matewka