使用Http JSON AngularJS 2时出错

时间:2016-02-11 21:13:47

标签: angular

我尝试使用以下代码后尝试了几种在线教程我无法使其工作。

..//
import {Http, HTTP_PROVIDERS} from 'angular2/http';

@Component({

    viewProviders: [HTTP_PROVIDERS],

    template: `
    ..//
    <div class="col-md-6 col-md-offset-3 well">

        <input type="button" class="btn btn-success btn-block"
        (click)="get()" value="Fetch Users">

        <hr>
        <ul>
           <li *ngFor="#user of users">
             Id: {{ user.name }} | Name: {{ user.name }} | JSON: {{ user | json }}
           </li>
        </ul>
    </div>

    ..//

export class Mov {

    //Inicio test http

    users: Array<Object>;
    http: any;

    //
    //constructor(@Inject(HttpFactory) http) {
    //constructor(http: Http) {
    constructor(http: Http){
         //
        this.http = http;
    }

    get(){
        this.http('resources/users.json')
        .map(res => res.json())
        .subscribe(users => this.users = users);
    }

获取此错误:

  

EXCEPTION:评估“点击”

时出错      

ORIGINAL EXCEPTION:TypeError:this.http不是函数

任何人都可以告诉我,我做错了,对不起我的英语。

2 个答案:

答案 0 :(得分:3)

似乎某种方式Http没有被正确注入。使用@Inject注入Http依赖项。

import { Component, Inject} from 'angular2/core';
//above code should be at start.

constructor(@Inject(Http) http: Http) {
当不使用Typescript来转换JS时,需要

@Inject来获取依赖。

答案 1 :(得分:3)

好吧,因为错误消息状态this.http不是函数,它是一个有多种方法的对象。您需要this.http.get()方法:

this.http.get('resources/users.json')
    .map(res => res.json())
    .subscribe(users => this.users = users);