我的角度应用程序中的资产中有一个名为 fake.json 的html文件。该文件的路径是这样的。
MyApp => src =>资产=> json => fake.json
我想使用位于应用程序文件夹内的组件中的HttpClient向此文件发出<div class="app-body">
<main class="main d-flex align-items-center">
<div class="container center">
<div class="row">
<div class="col-md-8 mx-auto">
<div class="card-group">
<div class="card p-4">
<div class="card-body">
<form [formGroup]="userForm" (submit)="login()">
<h1>{{ 'pages[login_page][login_form][labels][login]' | translate }}</h1>
<p class="text-muted">{{ 'pages[login_page][login_form][labels][sign_in]' | translate }}</p>
<div class="input-group mb-3">
<div class="input-group-prepend">
<span class="input-group-text"><i class="icon-user"></i></span>
</div>
<div #username> </div>
</div>
<div class="input-group mb-4">
<div class="input-group-prepend">
<span class="input-group-text"><i class="icon-lock"></i></span>
</div>
<div #password> </div>
</div>
<div class="row">
<div class="col-6">
<div #login></div>
<!-- <button type="button" class="btn btn-primary px-4" (click)="login()">{{ 'pages[login_page][login_form][buttons][login]' | translate }}</button> -->
</div>
<div class="col-6 text-right">
<div #forgot></div>
<!-- <button type="button" class="btn btn-link px-0">{{ 'pages[login_page][login_form][urls][forgot_password]' | translate }}</button>-->
</div>
</div>
</form>
</div>
</div>
<div class="card text-white bg-primary py-5 d-md-down-none" style="width:44%">
<div class="card-body text-center">
<div>
<h2>{{ 'pages[login_page][sign_up_panel][labels][sign_up]' | translate }}</h2>
<p>{{ 'pages[login_page][sign_up_panel][labels][new_account]' | translate }}</p>
<div #signUp></div>
<!-- <button type="button" class="btn btn-primary active mt-3">{{ 'pages[login_page][sign_up_panel][buttons][register]' | translate }}</button> -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</main>
</div>
请求。
MyApp => src => app =>统计=> statistics.component.ts
组件源代码
json我发生了以下错误
针对http://localhost:4200/assets/json/fake.json的HttpErrorResponse Http错误响应：找不到404
对此我有2个疑问。
使用Http或HttpClient向本地json文件发出POST请求是否有效。 （到目前为止，我已经使用Http而非HttpClient完成了export class StatisticsComponent {
persons: Person[];
options = {
sDom: 'rt<"bottom"p>',
pagingType: 'full_numbers',
pageLength: 10,
serverSide: true,
processing: true,
ajax: (dataTablesParameters: any, callback) => {
this.http
.post<DataTablesResponse>(
'./../../assets/json/fake.json',
dataTablesParameters, {}
).subscribe(resp => {
this.persons = resp.data;
callback({
recordsTotal: resp.recordsTotal,
recordsFiltered: resp.recordsFiltered,
data: []
});
});
},
columns: [
{ data: "id" },
{ data: "firstName" },
{ data: "lastName" }
]
};
constructor(private http: HttpClient) {
}
}
class Person {
id: number;
firstName: string;
lastName: string;
}
class DataTablesResponse {
data: any[];
draw: number;
recordsFiltered: number;
recordsTotal: number;
}
请求，并成功获取了数据）
当文件夹中的文件存在时为什么返回404 Not Found。
需要帮助。
答案 0 :(得分：2)
这是因为您放置在from IPython.display import YouTubeVideo
YouTubeVideo("KsdsCdzsito" , width=800 , height=700)
文件夹中的任何内容都将通过assets请求提供服务。您可以通过在浏览器上导航至GET来进行测试。如果要测试http://localhost:4200/assets/json/fake.json方法，则需要启动服务器。
POST在Angular的更高版本中已被弃用并删除。您应该将其更改为HttpModule
要使用HttpClientModule进行测试，可以执行以下操作。
将HttpClient添加到您的HttpClientModule
在组件中注入AppModule
HttpClient
并按照以下步骤进行请求
constructor(private httpClient: HttpClient) {}答案 1 :(得分：1)
为了从本地JSON文件读取或写入数据，您可以使用json-server。
npm i json-server。json-server --watch fake.json。http://localhost:3000/上请求服务器遵循文档链接：documentation