I'm facing an issue with my httpClient post request. The service is not throwing any errors, but it's also not successfully posting the data to the database.
Below is the code snippet:
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');
}
}
}
Lastly, here's app.component.html
<div (click)="myInsert()">Click Me</div>
I've analyzed the network tab in Chrome, but no POST requests are visible. How can I address this issue?