angular - HTTP 获取 404 未找到 URL : null

Question

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

我正在尝试将服务 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);
    }
}

内存中数据.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

Answer 1

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

它返回“集合”中的一个对象..

返回 {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