angular 模型数据到 spring pojo class 的映射无效

Question

我正在尝试将 angular 模型 class 映射到我的 spring 模型 class。但是，在 spring 模型 class 中，它为所有实体显示 null。下面是我的代码，我曾经这样做过，但它无法将 angular 模型数据映射到 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
}

加-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;
}

这是 angular 在我的控制台中打印的响应

{"Impression":"Campaign","Clicks":"Budget","Revenue":"Budget"}

Answer 1

首先，您应该根据 java 语言标准命名您的变量。在你的情况下，让它们以小写字母开头（只有类应该有大写字母）。另外，将所有变量设为私有：

public class HeaderMappingDetails{
    private String impressions;
    private String clicks;
    private String revenue;
    // getters and setters
}

你的 angular 代码对我来说看起来不错，我使用它有点不同：

saveHeaders(mapHeaders:HeaderMappingDetails){
    let url = this.serverPath+'/user/saveHeaders';
    const headers: HttpHeaders = new HttpHeaders();
    headers.set("content-type", "application/json");
    headers.set("x-auth-token", localStorage.getItem('xAuthToken'));
    const options = {
      headers: headers
    };
    console.dir(mapHeaders);
    return this.http.post(url, mapHeaders, options);
}

您不需要将对象字符串化。

对于您的情况，我还建议您对打字稿对象使用接口而不是对象：

export interface IHeaderMappingDetails {
    impressions: string;
    clicks: string;
    revenue: string;
}

angular 模型数据到 spring pojo class 的映射无效

mapping of angular model data to spring pojo class not working

java

spring

angular

typescript

angular-ui-router