Buen dia.
Lo que pasa es que estoy tratando de cargar un FormData a un servicio Front que luego en Back me esta llegando todo vacio y pues ya probe con Postman enviar un formdata y en back llega todos los datos como los mando entonces deduje que el error esta en el Front que podria ser mi error???
este es mi formulario reporte.component.html
<form [formGroup]="soporteForm" role="form">
<div fxLayout="row wrap" style="height: 100px">
<!--primer titulo-->
<div fxFlexOrder="1" fxLayout="column" fxFlex.xs="70" fxFlex.gt-xs="70" fxFlex.gt-sm="20" fxLayoutAlign="space-around stretch">
<h3 fxFill color="warn" fxFlex.xs="70" fxFlex.gt-xs="70" fxFlex.gt-sm="70" fxFlex="100">Pregunta o Asunto del Tiket:</h3>
</div>
<!--primer input-->
<div fxFlexOrder="1" fxLayout="column" fxFlex.xs="100" fxFlex.gt-xs="70" fxFlex.gt-sm="50" fxLayoutAlign="space-around stretch">
<mat-form-field fxFill color="warn" fxFlex.xs="70" fxFlex.gt-xs="70" fxFlex.gt-sm="70" fxFlex="100" appearance="outline">
<mat-label>Pregunta o Asunto del Tiket</mat-label>
<input matInput id="preuntaTiket" formControlName="pregunta" type="text" [value]="" placeholder="Pregunta o Asunto del Tiket" [type]="">
<mat-error>Este campo es obligatorio</mat-error>
</mat-form-field>
</div>
</div>
<!-- ------------------------------------------------------------- -->
<div >
<!--segundo titulo-->
<div>
<h3>Detalles de la petición: </h3>
</div>
<!--segundo input-->
<div>
<input type="file" (change)="getfile($event)" >
</div>
</div>
<!-- -------------------------------------------------------------------------------- -->
<div>
<div>
<button (click)="enviarTicket()">
Enviar Ticket
</button>
</div>
</div>
</form>
Este es mi ts aca llega todo correcto segun por los console log
reporte.component.ts
soporteForm:FormGroup;
ngOnInit() {
this.soporteForm = this.fb.group({
pregunta: ['', [
Validators.required
]]
});
}
enviarTicket(){
if(this.soporteForm.valid){
let datas = new FormData()
datas.append('pregunta', this.soporteForm.value.pregunta)
datas.append('evidencia', this.evidenciaFoto.get('evidencia'))
console.log(datas);
this.soporteService.createTikeckt(datas).subscribe();
}
}
evidenciaFoto = new FormData()
getfile(fileupload:Event){
this.evidenciaFoto.append('evidencia', fileupload.target['files'][0])
console.log(this.evidenciaFoto.get('evidencia'));
}
Pues segun vi con console log que estan ahi me di cuenta que llega todo bien osea no entienfdo que pasa que llega al back vacio reporte.service.ts
createTikeckt(data:FormData){
console.log(data.get('pregunta'));
console.log(data.get('evidencia'));;//en esto si me doy cuenta que la
//info llega bien talvez este equivocado y en realidad esta llegando hasta aca vacio
let headers = new HttpHeaders();
headers = headers.set( "Content-Type", "multipart/form-data")
return this.http.post(`${environment.apiUrl}/api/soporte/crear/ticket/`, data);
}
Por favor ayuda
headers = headers.set( "Content-Type", "multipart/form-data")
JSON parse error - 'utf-8' codec can't decode byte 0x89 in position 336: invalid start byte