ログイン・ページのエラー： 'HTTP'（HTML /活字体/ Angular2/Javascriptを）存在しないエラーの

Question

スクリーンショット：フルプロジェクトへ

リンク：

https://www.dropbox.com/s/2aqrv63tmv3avnd/FullProject2.zip?dl=0

リンクログインページの例に：

http://plnkr.co/edit/j69yu9cSIQRL2GJZFCd1?p=preview

（例えば、ユーザ名とパスワードは、 "テスト" である）

エラーを含むコード：

return this.http.post('/auth/login', JSON.stringify({} 

dashboard.component.tsの完全なコード

import {Component, OnInit} from 'angular2/core'; 
import {Router} from 'angular2/router'; 
import {Hero} from './hero'; 
import {HeroService} from './hero.service'; 
import {RouteConfig, ROUTER_DIRECTIVES} from 'angular2/router'; 
import {HeroesComponent} from './heroes.component'; 
import {HeroDetailComponent} from './hero-detail.component'; 
import {SpreadSheetComponent} from './spreadsheeteditall.component'; 
import {SwitchUsersComponent} from './SwitchUsers.component'; 
import {BiddingPageComponent} from './BiddingPage.component'; 
import { Injectable } from 'angular2/core'; 
import { Jsonp, URLSearchParams } from 'angular2/http'; 
import {HTTP_PROVIDERS, Http, Headers} from 'angular2/http'; 
import {JSONP_PROVIDERS} from 'angular2/http'; 
@Component({ 
    selector: 'my-dashboard', 
    templateUrl: 'app/dashboard.component.html', 
    styleUrls: ['app/dashboard.component.css'], 
    directives: [ROUTER_DIRECTIVES], 
    providers : [HTTP_PROVIDERS, Http], 
}) 
export class DashboardComponent implements OnInit { 
    heroes: Hero[] = []; 

    constructor(private _http: Http, private _heroService: HeroService, private _router: Router) { 
     this.token = localStorage.getItem('token'); 
    } 

    ngOnInit() { 
    this._heroService.getHeroes().then(heroes => this.heroes = heroes.slice(1,5)); 
    } 

    gotoDetail(hero: Hero) { 
    let link = ['HeroDetail', { id: hero.id }]; 
    this._router.navigate(link); 
    } 
    @Injectable() 

    token: string; 


    login(username: String, password: String) { 


    return this.http.post('/auth/login', JSON.stringify({} 
    // username: username, 
    // password: password 
    // }), { 
    // headers: new Headers({ 
    // 'Content-Type': 'application/json' 
    // }) 
    // }) 

    // .map((res : any) => { 
    // let data = res.json(); 
    // this.token = data.token; 
    // localStorage.setItem('token', this.token); 
    // }); 

    // for the purpose of this cookbook, we will juste simulate that 

    if (username === 'test' && password === 'test') { 
     this.token = 'token'; 
     localStorage.setItem('token', this.token); 
     //return Rx.Observable.of('token'); 
    } 

    //return Rx.Observable.throw('authentication failure'); 
    , 

    logout() { 

    }} 
/* 
    return this._http.get(this.config.serverUrl + '/auth/logout', { 
     headers: new Headers({ 
     'x-security-token': this.token 
     }) 
    }) 
    .map((res : any) => { 
     this.token = undefined; 
     localStorage.removeItem('token'); 
    }); 


// this.token = undefined; 
// localStorage.removeItem('token'); 

    // return Rx.Observable.of(true); 
    } 
} 

Answer 1

（これを試してみてください_http）：

return this._http.post('/auth/login', JSON.stringify({}