Question

我从事Angle 7项目，并使用ngx-dropzone-wrapper模块将图像上传到服务器Web API 我可以顺利上传图片但我将以更新模式显示存在的已上传图像。

我的HTML附加码

<dropzone class="dropzone-container" [config]="config" fxLayout="row" fxLayoutAlign="start strech"
            #nationalDropZone (success)="onUploadSuccess($event)" fxFlex="auto" (init)="nationalDropZoneInit($event)"
            [message]="'Please Add '"></dropzone>

  @ViewChild('nationalDropZone') componentRef?: DropzoneComponent;
  dropzone: any;

然后在此处初始化dropzone

  nationalDropZoneInit(arg: any): void {
  this.dropzone = this.componentRef.directiveRef.dropzone();
  }

我在此处读取用户信息，在字符串url模板中包括用户个人资料图像我从服务器返回的模型具有profileImageUrl属性，该属性在浏览器URL上输入时可以看到图像。现在我将在dropzone上添加具有预览缩略图的现有图像

this.accountService.getResellerProfile().subscribe((res: ResellerInfoModel) => {
//Add res.profileImageUrl  to dropzone
//I do not know how
 });

Answer 1

希望这会有所帮助。

const dropzone = this.componentRef.directiveRef.dropzone();

const mockFile = { name: "some name", size: "some size" };

dropzone.emit( "addedfile", mockFile );
dropzone.emit( "thumbnail", mockFile, res.profileImageUrl );
dropzone.emit( "complete", mockFile);

我从this answer得到了一些帮助。

如何在Angular 7的ngx-dropzone-wrapper中的服务器上显示现有文件

1 个答案: