How to Configure a valid #ResponseBody for a POST with spring and angular 4 - spring

Question

I'm getting this error:
core.js:1448 ERROR SyntaxError: Unexpected end of JSON input
I think the error is in the response , how i can correct create a #responseBody
for the front to understand that the object in the back end is created properly
the input is (license:"gd345") without the parentheses
Component file:
import { Component, OnInit } from '#angular/core';
import { Http, Headers } from '#angular/http';
#Component({
selector: 'posts',
templateUrl: './posts.component.html',
styleUrls: ['./posts.component.css']
})
export class PostsComponent {
posts: any[];
letter: any;
constructor(private http: Http) {
http.get('http://localhost:8183/api/vehiculespark')
.subscribe(response => {
this.posts = response.json();
});
}
createPost(input: HTMLInputElement) {
debugger;
let post = { license: input.value };
this.letter = post;
const headers = new Headers({ 'Content-Type': 'application/json' });
this.http.post('http://localhost:8183/api/vehicules', this.letter, { headers: headers })
.subscribe(response => {
console.log(response.json())
});
debugger;
}
}
spring Controller:
package com.api.kingspark.parking.controller;
import com.api.kingspark.parking.domain.Tickect;
import com.api.kingspark.parking.domain.Vehicule;
import com.api.kingspark.parking.repositories.TicketRepository;
import com.api.kingspark.parking.repositories.VehiculoRepository;
import com.api.kingspark.parking.services.PorteroServices;
import org.reactivestreams.Publisher;
import org.springframework.http.HttpStatus;
import org.springframework.http.MediaType;
import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.*;
import reactor.core.publisher.Flux;
import reactor.core.publisher.Mono;
import java.util.List;
import static org.springframework.http.MediaType.APPLICATION_JSON_VALUE;
import static org.springframework.http.MediaType.APPLICATION_XML_VALUE;
#RestController
public class ParkingController {
private PorteroServices porteroServices;
private final VehiculoRepository vehiculoRepository;
private final TicketRepository ticketRepository;
public ParkingController(PorteroServices porteroServices, VehiculoRepository vehiculoRepository, TicketRepository ticketRepository) {
this.porteroServices = porteroServices;
this.vehiculoRepository = vehiculoRepository;
this.ticketRepository = ticketRepository;
}
#CrossOrigin
#GetMapping("/api/vehiculespark")
List<Tickect> listIn(){
return porteroServices.getInVehicules();
}
#GetMapping("/api/vehicules")
Flux<Vehicule> listAll(){
return vehiculoRepository.findAll();
}
#GetMapping("/api/vehicules/{id}")
Mono<Vehicule> getById(#PathVariable String id){
return vehiculoRepository.findById(id);
}
#CrossOrigin
#ResponseStatus(HttpStatus.CREATED)
#PostMapping(value = "/api/vehicules",consumes="application/json",produces={"application/json","application/xml"})
#ResponseBody
Mono<Void> createVehicule(#RequestBody Publisher<Vehicule> carstream){
Vehicule ca= Mono.fromDirect(carstream).cache().block();
return porteroServices.saveVehicule(ca);
//return ResponseEntity.created(location).build();
}
#PutMapping("/api/vehicules/{id}")
Mono<Tickect> update(#PathVariable String id, #RequestBody Vehicule vehicule){
return ticketRepository.save(porteroServices.drawVehicule(id));
}
}