Http获取404 Not Found for URL:null

时间:2016-12-07 07:17:14

标签: angular angular2-services

我尝试过像英雄之旅这样的示例应用程序。

我正在尝试将服务cal转换为http get(InMemoryDbService),如下所示

hero.service.ts

import {Injectable} from '@angular/core';
import {HttpModule, Headers, Http} from '@angular/http';
import 'rxjs/add/operator/toPromise';

import {Hero} from './hero';

@Injectable()
export class HeroService {

    private heroesUrl = 'app/heroes'; 

    constructor(private http : Http) { }

    // working code
    //getHeroes(): Promise<Hero[]> {
    //    return Promise.resolve(HEROS);
    //}

    getHeroes(): Promise<Hero[]> {
        debugger;
        return this.http.get(this.heroesUrl).toPromise().then(responce => responce.json().data as Hero[]).catch(this.handleError);

    }
    private handleError(error: any): Promise<any> {
        console.error('An error occurred', error); // for demo purposes only
        return Promise.reject(error.message || error);
    }
}

内存-data.service.ts

    import {InMemoryDbService} from 'angular-in-memory-web-api';

    export class InMemoryDataService implements InMemoryDbService {
    createDb() {
        let heroes = [
            { id: 1, name: 'Thulasi' },
            { id: 2, name: 'Bala' },
            { id: 3, name: 'Thulasi' },
            { id: 4, name: 'Thulasi' },
            { id: 5, name: 'Thulasi' },
            { id: 6, name: 'Thulasi' },
            { id: 7, name: 'Thulasi' },
            { id: 8, name: 'Thulasi' },
            { id: 9, name: 'Thulasi' },
            { id: 10, name: 'Thulasi' },
            { id: 11, name: 'Thulasi' }
        ];
        return heroes;
    }
}

抛出错误:

hero-service.ts:25 An error occurred Response_body: Object
    headers: Header
    sok: false
    status: 404
    statusText: "Not Found"
    type: null
    url: null
    __proto__: Body
HeroService.handleError @ hero-service.ts:25
    ZoneDelegate.invoke @ zone.js:232
    onInvoke @ core.umd.js:5975
    ZoneDelegate.invoke @ zone.js:231
    Zone.run @ zone.js:114
    (anonymous function) @ zone.js:502
    ZoneDelegate.invokeTask @ zone.js:265
    onInvokeTask @ core.umd.js:5966
    ZoneDelegate.invokeTask @ zone.js:264
    Zone.runTask @ zone.js:154
    drainMicroTaskQueue @ zone.js:401
    ZoneTask.invoke @ zone.js:339
    core.umd.js:2837 EXCEPTION: Uncaught (in promise): Response with status: 404 Not Found for URL: null

1 个答案:

答案 0 :(得分:4)

我看到的一件事是,createDb()看起来不像原作..

它返回&#34;集合中的对象&#34; ..

return {heroes};

我想lib需要这个对象来构建这些URL ..

文档:https://github.com/angular/in-memory-web-api

英雄之旅:https://angular.io/docs/ts/latest/guide/server-communication.html#!#appendix-tour-of-heroes-in-memory-server