I am currently having issues mapping an Angular model class to my Spring model class. When I try to do so, all the entities in the Spring model class show up as null. I have included the code snippets below that I used for mapping, but unfortunately, it fails to map the Angular model data to the Spring POJO class.
HeaderMappingDetails.java
public class HeaderMappingDetails{
String Impressions;
String Clicks;
String Revenue;
//getters and setters
}
headermappingdetails.ts
export class HeaderMappingDetails{
public Impressions:string;
public Clicks:string;
public Revenue:string
}
add-client.component.ts
saveHeaders(){
this.clientService.saveHeaders(this.headerMap).subscribe(
res=>{
console.log(res);
},error=>{
console.log(error);
}
);
}
client.service.ts
saveHeaders(mapHeaders:HeaderMappingDetails){
let url = this.serverPath+'/user/saveHeaders';
let tokenHeader = new Headers({
'Content-Type' : 'application/json',
'x-auth-token' : localStorage.getItem('xAuthToken')
});
console.log(JSON.stringify(mapHeaders));
return this.http.post(
url,JSON.stringify(mapHeaders),
{headers : tokenHeader}
);
}
addClient.html
<form [hidden]="!showMapper" (ngSubmit)="saveHeaders()">
<mat-form-field class="full-width">
<mat-select placeholder="Map Impression As" [(ngModel)]="headerMap.Impression" id="Impression" name="Impression">
<mat-option *ngFor="let option of mapper" [value]="option">{{option}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field class="full-width">
<mat-select placeholder="Map Clicks As" [(ngModel)]="headerMap.Clicks" id="Clicks" name="Clicks">
<mat-option *ngFor="let option of mapper" [value]="option">{{option}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field class="full-width">
<mat-select placeholder="Map Revenue As" [(ngModel)]="headerMap.Revenue" id="Revenue" name="Revenue">
<mat-option *ngFor="let option of mapper" [value]="option">{{option}}</mat-option>
</mat-select>
</mat-form-field>
<button mat-raised-button type="submit" class="mat-primary">Save Mapped Headers</button>
</form>
HeaderMappingController.java
@PostMapping(value = "/saveHeaders")
public HeaderMappingDetails saveHeaders(@RequestBody HeaderMappingDetails headerMappingDetails) throws Exception {
Integer clientId = Integer.parseInt(jedis.get("emailClientId"));
boolean isSuccess = headerMappingService.saveHeaders(headerMappingDetails, clientId);
return headerMappingDetails;
}
This is the response printed by Angular in my console
{"Impression":"Campaign","Clicks":"Budget","Revenue":"Budget"}