Post method in Reactive Forms Angular 8

Question

I created My Reactive Form called Compaign and Im almost done from the back end part! Im working on the frontend !! I want to register the form via my UI However it turns out an error of connection localhost:3000/api/register! I tried it via my backend using postman and it works !However in my front end , When im saving my inputs ; the console displays this error http://localhost:3000/api/register net::ERR_CONNECTION_REFUSED Im getting confused now !

compaign.component.ts

export class CompaignComponent implements OnInit {

compaignexample : FormGroup ;
showSucessMessage : boolean ;
serverErrorMessage: String ;

ngOnInit () {

    this.compaignexample = new FormGroup ({

    requestidname: new FormControl('', Validators.required),
    integritykeyname : new FormControl(),

})

}
constructor ( private _compaignService : CompaignService)  {}
saveCompaign() {

    let compaignform: CompaignForms = new CompaignForms(
        this.compaignexample.get('requestidname').value,
        this.compaignexample.get('integritykeyname').value,
    );
        console.log(compaignform);
        this._compaignService.postCompaign(compaignform).subscribe(   */ I have some doubts on this 
 Line I dont know which parameter should I put for postCompaign() */
     ......    
        );
        }
    }

compaign.service.ts

@Injectable ({

providedIn : 'root'

})
export class CompaignService {

selectedCompaign : CompaignForms = {
    requestid: null ,    
    integritykey: ''
};
constructor (private http :HttpClient) { }
    postCompaign(compaignform : CompaignForms)  {
      return  this.http.post( environment.apiBaseUrl+'/register',compaignform);

    } 
}

compaignexample.model.ts

export class CompaignForms {
requestid : Number;
integritykey:String;

constructor(requestid: Number,integritykey) {
    this.requestid =requestid ;
   this.integritykey=integritykey;

}

}

environment.ts

export const environment = {
production: false ,
apiBaseUrl: 'http://localhost:3000/api' ,
};

and there is this error ````ERROR HttpErrorResponse {headers: HttpHeaders, status: 0, statusText: "Unknown Error", url: "http://localhost:3000/api/register"```` — Zakaria Belassal, Oct 20 '19 at 21:25
https://stackoverflow.com/questions/47180634/i-get-http-failure-response-for-unknown-url-0-unknown-error-instead-of-actu — Abolfazl Roshanzamir, Oct 20 '19 at 22:06

score 0 · Accepted Answer · answered Oct 20 '19 at 21:32

0

Try removing the localhost part from:

this.http.post( environment.apiBaseUrl+'/register',compaignform);

The httpClient calls will be made to the current server:

this.http.post('/api/register',compaignform);

answered Oct 20 '19 at 21:32

Drenai

11,315
9
48
82

1

Thanks a lot Man !! – Zakaria Belassal Oct 21 '19 at 17:26

Post method in Reactive Forms Angular 8

1 Answers1