POST列表<object>从Angular2服务到SpringBoot RestController

Question

enter image description here您好我实际上是在Angular2（前端）和Springboot（后端）中的应用程序。 现在，我已经做了很多从angular2到Springboot的请求，例如GET; POST。我甚至将单个Json对象从Angular2服务发送到Springboot。

但目前我有一个场景，我需要将Json对象列表从Angular2发送到Springboot其余控制器。但不幸的是我无法做到这一点。

我在做什么是

1：我已经做类型的数组，我需要在angular2发送对象。 2：将具有相同txpe的单个json对象推入该数组中 3.将该数组放到函数调用中的angular2服务中。 4.最后制成Springboot控制器POST请求下面

是我的功能到JSON对象添加到数组：

updateChecked(value, event) { 
    // console.log(event.target.getAttribute('value')); 

    if (event.target.checked) { 
     // this.checkArr.push(event.target.getAttribute('value')); 
     this.checkArr.push({ 
      profil_id: event.target.getAttribute('value'), 
      profil_name_lang: null, 
      profil_name_short: null, 
      geschaeftsbereich: null, 
      spezialberatung: null 
     }); 
    } else if (!event.target.checked) { 
     //let indexx = this.checkArr.indexOf(event.target.getAttribute('value')); 
     let indexx = this.checkArr.findIndex(_profile => _profile.profil_id === event.target.getAttribute('value')); 
     this.checkArr.splice(indexx, 1); 
     console.log(indexx); 
    } 
} 

下面

是我Angular2服务功能

private _deleteURL = 'http://localhost:9000//deleteprofile' 
private headers1 = new Headers({'Content-Type' : 'application/x-www-form-urlencoded'}); 

deleteProfile(chckArr: Profile[]): Promise <Profile> { 
    // console.log("karan in delete"); 
    console.log(chckArr); 
    return this.http 
     .post(this._deleteURL, chckArr, { 
      headers: this.headers1 
     }) 
     .toPromise() 
     .then(res => res.json().data as Profile) 
     .catch(this.handleError); 
} 

下面

是我Springboot功能： -

@RequestMapping(method = RequestMethod.POST, value = "/deleteprofile") 
public void deleteProfile(@RequestBody List <Profile> profile) { // function to delete an existing profiles 

    try { 
     //  profileservice.deleteProfile(profile); 
    } catch (Exception e) { 
     e.printStackTrace(); 
    } 
} 

实体类在An在Springboot gular2

export class Profile { 
    profil_id: string; 
    profil_name_lang: string; 
    profil_name_short: string; 
    geschaeftsbereich: string; 
    spezialberatung: string; 
} 

实体类

package permissionbackendservice.permissionmatrix.domain; 

import java.io.Serializable; 

import javax.persistence.Column; 
import javax.persistence.Entity; 
import javax.persistence.GeneratedValue; 
import javax.persistence.GenerationType; 
import javax.persistence.Id; 
import javax.persistence.IdClass; 
import javax.persistence.Table; 

import com.fasterxml.jackson.annotation.JsonIgnore; 


@Entity 
//@IdClass(ActivityId.class) 
@Table(name = "T_DM_VM_PROFILE_DIM") 

public class Profile implements Serializable { 


    /** 
    * 
    */ 
    private static final long serialVersionUID = 1 L; 


    @Id @GeneratedValue(strategy = GenerationType.IDENTITY) 
    @Column(name = "PROFIL_ID") 
    private String profil_id = null; 


    @Column(name = "PROFIL_NAME_LANG") 
    private String profil_name_lang = null; 

    @Column(name = "PROFIL_NAME_KURZ") 
    private String profil_name_short = null; 

    @Column(name = "GESCHAEFTSBEREICH") 
    private String geschaeftsbereich = null; 

    @Column(name = "SPEZIALBERATUNG") 
    private String spezialberatung = null; 




    public String getProfil_id() { 
     return profil_id; 
    } 

    public void setProfil_id(String profil_id) { 
     this.profil_id = profil_id; 
    } 

    public String getProfil_name_lang() { 
     return profil_name_lang; 
    } 

    public void setProfil_name_lang(String profil_name_lang) { 
     this.profil_name_lang = profil_name_lang; 
    } 

    public String getProfil_name_short() { 
     return profil_name_short; 
    } 

    public void setProfil_name_short(String profil_name_short) { 
     this.profil_name_short = profil_name_short; 
    } 

    public String getGeschaeftsbereich() { 
     return geschaeftsbereich; 
    } 

    public void setGeschaeftsbereich(String geschaeftsbereich) { 
     this.geschaeftsbereich = geschaeftsbereich; 
    } 

    public String getSpezialberatung() { 
     return spezialberatung; 
    } 

    public void setSpezialberatung(String spezialberatung) { 
     this.spezialberatung = spezialberatung; 
    } 
} 

错误：

Answer 1

更改控制器deleteProfile（）使用阵列为@RequestBody这样方法：

@RequestMapping(method = RequestMethod.POST, value = "/deleteprofile") 
public void deleteProfile(@RequestBody Profile[] profile) { 
// function to delete an existing profiles 

    try { 
     //  profileservice.deleteProfile(profile); 
    } catch (Exception e) { 
     e.printStackTrace(); 
    } 
} 

如果profileservice.deleteProfile（）要求的个人资料，而不是一个数组，你可以使用Arrays.asList（配置文件）

在客户端得到它的列表，你必须发送应用/ json请求。因此，通过删除标头更新您的客户端请求：

private _deleteURL = 'http://localhost:9000/deleteprofile' 

deleteProfile(chckArr: Profile[]): Promise <Profile> { 
    // console.log("karan in delete"); 
    console.log(chckArr); 
    return this.http 
     .post(this._deleteURL, chckArr) 
     .toPromise() 
     .then(res => res.json().data as Profile) 
     .catch(this.handleError); 
} 

这不是问题，但您忘记了URL中的尾部“/”。

UPDATE WITH WORKING CODE：

休息控制器在人的microService：

import {Injectable} from '@angular/core'; 
import {Http} from '@angular/http'; 
import {Person} from './person.model'; 
import {Observable} from 'rxjs/Observable'; 
@Injectable() 
export class CustomService { 
    constructor(private http: Http) { 

    } 

    batchDelete(persons: Person[]): Observable<any> { 
     return this.http.post('/person/api/deleteperson', persons); 
    } 

} 

删除方法INT person.component.ts：

在网关

@RestController 
@RequestMapping("/api") 
public class CustomController { 
    private static Logger log = LoggerFactory.getLogger(CustomController.class); 

    @Autowired 
    PersonService personService; 

    @RequestMapping(method = RequestMethod.POST, value = "/deleteperson") 
    public ResponseEntity deletePerson(@RequestBody Person[] persons) { 
     log.info(" Batch delete " + persons); 
     personService.delete(Arrays.asList(persons)); 
     return ResponseEntity.ok().build(); 
    } 

} 

角服务

batchDelete() { 
    console.log('--- delete ---- ' + JSON.stringify(this.people)); 
    this.customService.batchDelete(this.people).subscribe((res) => { 
     this.eventManager.broadcast({ name: 'personListModification', content: 'Delete them all'}); 

    }); 
} 

个

CODE ON GITHUB

结果： BEFORE

AFTER DELETE