Question

最近我学习了angular2的http客户端，我用angular-in-memory-web-api完成了演示。现在我想使用http.get来请求本地json数据，但浏览器告诉我{{1在阅读了Angular2 404 Not Found for URL: http://localhost/WebApi2/api/hero和the simliar one of angular get的相关帖子后，我删除了zone.js:1980 GET http://localhost:4200/app/hero.json 404 (Not Found)，'angular-in-memory-web-api'以及我项目中的相关文件，但问题是{{} 1}}是stil存在，密钥代码如下：

InMemoryWebApiModule.forRoot(HeroData)

// hero.service.ts 404 (Not Found)

//app.module.ts
@NgModule({
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    JsonpModule,
  ],
  declarations: [
    AppComponent,
    HeroListComponent,
    HeroListPromiseComponent,
    WikiComponent,
    WikiSmartComponent
  ],
  providers: [ requestOptionsProvider ],
  bootstrap: [ AppComponent ]
})
export class AppModule {}

如果您想要所有代码，我已将其推送到我的github。这是address

任何人都可以帮助我

Answer 1

您需要更改webpack配置。试试这个：

{
                test: /\.json$/,
                exclude: /node_modules/,
                use: [
                    {
                        loader: 'file-loader',
                        options: {
                            name: '[name].json'
                        }
                    }
                ]
            }

如果您使用的是vendor.ts文件，请尝试以下方法：

import './app/hero.json';

在服务中：

@Injectable()
export class HeroService {
  private heroesUrl = './app/hero.json';

  constructor (private http: Http) {}

  getHeroes(): Observable<Hero[]> {
    // debugger;
    return this.http.get(this.heroesUrl)
                    .map(this.extractData)
                    .catch(this.handleError);
  }
  private extractData(res: Response) {
    // http.get or http.post return the json obj
    let body = res.json();
    return body.data || { };
  }

Answer 2

感谢所有试图帮助我解决问题的人。现在，我找到了答案，这意味着我们应该将可访问资源放在资产文件中，以便用户可以从服务器获取。所以我只是尝试一下问题解决了。希望这对遇到问题的每个人都有帮助; the answer i saw

angualr2使用http.get（）来请求本地json数据

2 个答案: