Missing parameter(s): email, password error is occurring on posting data in angular4?

I am new to angular 4. I am working on login page in which I have to post the user information on login.But I am getting error as "code":"rest_missing_callback_param","message":"Missing parameter(s): email, password" on posting data.Below is my code:


import { Component, OnInit } from '@angular/core';
import {Http,Response,Headers, RequestOptions} from '@angular/http';
import { Router} from '@angular/router';
import { NgForm } from '@angular/forms';

@Component({
selector: 'app-register',
templateUrl: './register.component.html',
styleUrls: ['./register.component.css']
})
export class RegisterComponent implements OnInit {

constructor(private http:Http,private router:Router) { }
login(){
this.router.navigate(['login']);
}
createAuthorizationHeader(headers: Headers) {
headers.append('Authorization', 'Basic ' +
btoa('ck_543700d9f8c08268d75d3efefb302df4fad70a8f:cs_f1514261bbe154d662eb5053880d40518367c901'));
headers.append("Content-Type", "application/x-www-form-urlencoded");
}
onSubmit(userForm:NgForm){
console.log(userForm.value);
let headers=new Headers();
this.createAuthorizationHeader(headers);
const body={
"email": userForm.value.email,
"first_name": userForm.value.fname,
"last_name": userForm.value.lname,
"username": userForm.value.uname,
"password": userForm.value.password
}
console.log(body);
console.log(headers);
this.http.post('https://www.colourssoftware.com/wordpress/wp-json/wc/v2/customers',body,{
headers:headers
})
.subscribe(
data => {
console.log(data);
},
err => {
console.log("ERROR!: ", err);
}
);

}
ngOnInit() {
}

}

<form class="animated wow slideInUp" data-wow-delay=".5s" #regForm="ngForm" (ngSubmit)="onSubmit(regForm)">
<input type="text" placeholder="First Name..." required=" " name="fname" ngModel>
<input type="text" placeholder="Last Name..." required=" " name="lname" ngModel>
<input type="text" placeholder="UserName..." required=" " name="uname" ngModel>
<h6 class="animated wow slideInUp" data-wow-delay=".5s">Login information</h6>

<input type="email" placeholder="Email Address" required=" " name="email" ngModel>
<input type="password" placeholder="Password" required=" " name="password" ngModel>
<div class="register-check-box">
<div class="check">
<label class="checkbox"><input type="checkbox" name="checkbox"><i> </i>I accept the terms and conditions</label>
</div>
</div>
<input type="submit" value="Register">
</form>

Where I have done the mistake? How can I post the data to the server in angular 4? Please help me.

Continue reading...