【问题标题】:Angular2 - TypeError: this.http.get(...).toPromise is not a functionAngular2 - TypeError: this.http.get(...).toPromise 不是一个函数
【发布时间】:2016-12-31 11:16:06
【问题描述】:

我尝试关注 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';

user.ts 基本上是 TOH 中heroe.ts 的副本,所以:

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

我如何在服务中调用此特定方法: 首先我尝试了多种方法,但在调试时我只尝试 console.log :

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

当页面在控制台中加载时,我发现了多个错误: 第一个是:

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

第二个是:

例外:类型错误:this.http.get(...).toPromise 不是 functionBrowserDomAdapter.logError @

服务本身看起来不错。我在这一行将我的服务添加到app.module.ts

providers: [ HTTP_PROVIDERS, UserService ]

如果我直接使用某些函数返回数据(并注释掉调用getUsertHttp 函数),它就可以工作:

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

我试图描述所有可能很重要的事情,如果问题有点长,我很抱歉。 请大家给我提示一下我做错了什么?

【问题讨论】:

  • 能不能同时粘贴index.html和main.ts? polyfill 中可能缺少 core-js 或 es6-shim。

标签: angular typescript


【解决方案1】:

看起来您缺少导入:

import 'rxjs/add/operator/toPromise';

【讨论】:

  • 嗨@Stefan Svrkota,你是对的,我错过了那个导入。无论如何,我会将您的问题标记为正确,但也许有任何提示为什么 this.httpUsers 是未定义的? this.userService .getUsersHttp() .then(users =&gt; this.httpUsers = users) .catch(error =&gt; this.error = error);
  • jsonplaceholder.typicode.com/users 返回一个 json 数组,而不是具有 .data 成员的对象
  • 谢谢你们,Philippe 是对的,
  • 很高兴你修好了。
  • 奇怪的是,它在没有这个导入的情况下为我工作了几个星期。然后,最终,它停止工作,天知道为什么。
猜你喜欢
  • 2020-04-21
  • 2018-06-21
  • 2017-02-15
  • 2019-01-25
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多