¿Cómo puedo hacer que las imágenes cargadas vayan con los datos cuando hago clic en el botón enviar? Ahora tengo un problema en el hecho de que cuando selecciona las imágenes se descargan inmediatamente al servidor y hay una solicitud posterior a la API. Uso Rails 5 para api gallery.component.ts
name: string; uploadFile: any; hasBaseDropZoneOver: boolean = false; uploadedFiles: any[] = []; options: Object = { url: 'http://localhost:3000/galleries' }; sizeLimit = 2000000; handleUpload(data): void { if (data && data.response) { data = JSON.parse(data.response); this.uploadFile = data; this.name = this.uploadFile.filename; } } fileOverBase(e:any):void { this.hasBaseDropZoneOver = e; } beforeUpload(uploadingFile): void { if (uploadingFile.size > this.sizeLimit) { uploadingFile.setAbort(); alert('File is too large'); } }
tienda.component.ts
id : number; owner_id :number; submit(user){ user.owner_id= this.authTokenService.currentUserData.id; this.httpService.postData(user) .subscribe((data) => {this.receivedUser=data; this.done=true;this.router.navigate(['/profile'])}); } ngOnInit() { this.getUserShops(this.authTokenService.currentUserData.id) .subscribe((ownerShops) => { if (ownerShops.length > 0) { // User has at least 1 shop this.router.navigate(['/profile']) console.log(ownerShops.id); } else { // User has no shops } }) }
tienda.componente.html
Nombre <div class="form-group"> <label>About</label> <input class="form-control" type="text" name="about" [(ngModel)]="user.about" /> </div> <div class="form-group"> <label>opening</label> <input class="form-control" type="text" name="opening" [(ngModel)]="user.opening" /> </div> <div class="form-group" > <label>closing</label> <input class="form-control" type="text" name="closing" [(ngModel)]="user.closing" /> </div> <app-gallery> </app-gallery> <div class="form-group"> <button class="btn btn-default" (click)="submit(user)">Send</button> </div>
galería.componente.html
<input type="file" ngFileSelect [options]="options" (onUpload)="handleUpload($event)" (beforeUpload)="beforeUpload($event)" multiple>