サービスを介したhttpClientの投稿がありますが、エラーは表示されませんが、データはデータベースに投稿されません。
コードは次のとおりです。
dataService.ts
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
const httpOptions = {
headers: new HttpHeaders({ 'Content-Type': 'application/json' })
};
@Injectable()
export class DataService {
constructor(private http: HttpClient) {}
insertData() {
const body = JSON.stringify({firstName: 'Joele', lastName: 'Smith4'});
return this.http.post('http://myurl/index.php', body, httpOptions);
}
}
app.component.ts
import { Component } from '@angular/core';
import { DataService } from './services/data.service';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent {
constructor(private dataService: DataService) {}
myInsert() {
if (this.dataService.insertData()) {
alert('Data Inserted Successfully');
}
}
}
そして最後にapp.component.html
<div (click)="myInsert()">Click Me</div>
chromeネットワークの投稿を確認しましたが、何も表示されません。どうすれば修正できますか?
リクエストを行うには、オブザーバブルを監視する必要があります。
myInsert() {
this.dataService.insertData().subscribe(
response => console.log(response),
err => console.log(err)
);
}
私は同じ問題を抱えていて、私はこのように使用しました(FormDataを使用)。試してみてください。それは私のために働く。
insertData() {
let body = new FormData();
body.append('firstName', 'Joele');
body.append('lastName', 'Smith4');
return this.http.post('http://myurl/index.php', body, httpOptions);
}
let params = new HttpParams()
params=params.set('firstName', 'Joele');
params=params.set('lastName', 'Smith4');
this.http.post('http://myurl/index.php', params , httpOptions);