我从json文件中获取数据时遇到了奇怪的问题。我不知道为什么它不起作用,我可以说有一件事是流行的“它之前有效”。我收到错误:GET http://localhost:4200/apidata/femaleModels.json 404(未找到)。有人可以看看我的代码,看看有什么不对,也许我忘记了什么?
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { HttpModule } from '@angular/http';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { GalleryComponent } from './gallery/gallery.component';
import { TeamDemonstrationComponent } from './gallery/teamDemonstration/teamDemonstration.component';
import { PersonalDemonstrationComponent } from './gallery/personalDemonstration/personalDemonstration.component';
@NgModule({
declarations: [
AppComponent,
GalleryComponent,
TeamDemonstrationComponent,
PersonalDemonstrationComponent
],
imports: [
BrowserModule,
HttpModule
],
providers: [],
bootstrap: [AppComponent]
})
导出类AppModule {}
modelsService.ts:
import {Injectable} from '@angular/core'
import {Http, Response} from '@angular/http';
import { Observable } from "rxjs/Observable";
import 'rxjs/add/operator/map';
@Injectable()
export class ModelsService {
private _femaleModelsUrl: string = "apidata/femaleModels.json";
private _maleModelsUrl: string = "apidata/maleModels.json";
private _premiumModelsUrl: string = "apidata/premiumModels.json";
constructor(private _http: Http) {}
getFemaleModels() {
return this._http.get(this._femaleModelsUrl)
.map( (response: Response) => response.json() );
}
}
gallery.component.ts
import { Component, EventEmitter, OnInit } from '@angular/core';
import { ModelsService } from './modelsService/models.service';
@Component({
selector: 'app-gallery',
templateUrl: './gallery.component.html',
styleUrls: ['./gallery.component.scss'],
providers: [ModelsService],
})
export class GalleryComponent implements OnInit {
models: modelInterface[];
demonstrationType: string = 'team';
femaleModels: any;
constructor(private _modelsService: ModelsService) {}
ngOnInit() {
this._modelsService
.getFemaleModels()
.subscribe( responseFemaleModelsData => this.femaleModels = responseFemaleModelsData );
}
}
export interface modelInterface {
name: string;
height: number;
size: string;
hair: string;
eyes: string;
shoeSize: number;
dateOfBirth: number;
imgDir: string[];
}
文件树: