Sending a Post Request | Angular HTTP | Angular 15+
in app.module.ts add import
import { FormsModule } from '@angular/forms';
import {HttpClient, HttpClientModule} from '@angular/common/http';
imports: [
FormsModule,
HttpClientModule
],
2. Make view
<form #myForm="ngForm" class="mt-5" (ngSubmit)="handleForm(myForm.value)">
<input type="email" name="email" [(ngModel)]="email">
<input type="text" name="alert_preference" [ngModel]="alert_category" value="rat 9 bajay">
<input type="text" name="alert_category" ngModel value="all">
<button type="submit">Submit</button>
</form>
in component
import { HttpClient } from '@angular/common/http';
export class HomeComponent {
name:any = '';
constructor(private http:HttpClient){
}
email:string='';
alert_preference:string='weekly';
alert_category:string='all';
url:string='';
handleForm(data:any){
this.url="domain.com";
console.log(data);
this.http.post(this.url,data).subscribe((res)=>{
console.log(res);
});
}
}
SEND REQUEST WITH CUSTOM HEADERS:
import { HttpClient, HttpHeaders } from '@angular/common/http';
const headers = new HttpHeaders()
.set('Content-Type', 'text/plain');
const options = {
headers: headers
};
let req = this.http.post<any>("https://sample.net", {x:"cool"}, options);
req.subscribe(res => {
if (res == null) {
return;
}
console.log("All Filters: ", res);