Question

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

employees.service.ts

        <tr>
            <td><a href="form.php?"><?php echo  $row['Control_Num']; ?></a></td>
            <td><?php echo $row['Date_Req'];?></td>
            <td><?php echo $row['Date_Rev'];?></td>
            <td><?php echo $row['Rev_by'];?></td>
            <td><?php echo $row['Requester'];?></td>
            <td><?php echo $row['Dept'];?></td>
            <td><?php echo $row['email'];?></td>
            <td><?php echo $row['cont_num'];?></td>
            <td><?php echo $row['serv_req'];?></td>
            <td><?php echo $row['purpose'];?></td>
            <td><?php echo $row['app_by'];?></td>
        </tr>

app.component.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) );
    }

}

Answer 1

如果您使用angular cli，则必须通过在.angular-cli.json中设置json文件来输出您的json文件：

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

但我建议您在data文件夹中创建一个名为src的文件夹，并将所有数据.json归档到其中。然后让你的assets配置如下：

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

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

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

Answer 2

看起来你正试图访问“src”目录中的文件，该文件永远不会静态可用。

如果您需要直接访问该json文件，您需要确保它存储在Web服务器中可以直接提供的正确目录中（这通常通过在后端配置静态/服务设置来完成）。 / p>

仅仅因为项目文件夹中存在文件并不意味着网络服务器使所有文件都可用。

Answer 3

将文件放入yourProject/src/assets文件夹中，并像/assets/yourFilename.json那样给路径

Answer 4

您无需导航到您的src文件夹。如果文件位于src文件夹中，请使用this.http.get('employees.json');如果src文件夹中有数据文件夹，则使用this.http.get('data/employees.json')。

这是有效的，因为如果省略前导/，您在组件或服务（或者任何人）中编写的所有代码都会查找相对于index.html的路径。

Answer 5

您的文件路径可能不正确。因此404未找到。

尝试使用../或./或../../ etc

编辑路径

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

5 个答案: