Angular 4 - HTTP服务404.找不到JSON文件

Question

我是角度新手,我在http服务中遇到问题.我试过this.http.get(' http://jsonplaceholder.typicode.com/posts/1 ')作为样本数据,它可以工作.但当我使用this.http.get('src/data/employees.json')时,它显示404(未找到)

employees.service.ts

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
export class EmployeesService {

    constructor(private http: Http) { }

    getEmployees() {
        this.http.get('src/employees.json')
            .map(response => response.json() )
            .subscribe(result => console.log(result) );
    }

}

app.component.ts

import { Component } from '@angular/core';
import { EmployeesService } from './employees.service';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
})
export class AppComponent {

    constructor(private employeesService: EmployeesService){}

    ngOnInit() {
        this.employeesService.getEmployees();
    }

}

Answer 1

如果您正在使用angular cli,则必须通过如下设置输出您的json文件.angular-cli.json:

"assets": [
        "assets",
        "src/employees.json"
      ],

但我建议data您在src文件夹中创建一个文件夹,并将所有数据.json放入其中.然后让您的assets配置如下:

"assets": [
        "assets",
        "data"
      ],

这样cli将总是输出整个data文件夹,因此您不必.json单独指定每个文件

如果您在更改.angular-cli.json期间ng serve更改以生效,则必须重新启动ng serve