ng2-file-upload 多文件上传

发布于 2022-09-11 18:07:09 字数 1726 浏览 21 评论 0

  1. 现在我想做一个多文件上传的功能

2.

<div class="main">
    <div class="left">
        <div>File List:</div>
        <div id="files">
            <ul style="margin:0;padding:0">
              <li *ngFor="let item of files" pDraggable="filesTo"
                  (onDragStart)="dragStart($event,item)" (onDragEnd)="dragEnd($event)" (click)="doPreview(item)">
                  <p>{{item.filename}}</p>
              </li>
          </ul>
        </div>
    </div>
    <div class="right">
        <div>Drop file from List or <a href="javascript:void(0)" (click)="fileSelect.click()">browse</a> local file:</div>
        <input id="fileSelect" #fileSelect style="display:none" type="file" ng2FileSelect [uploader]="uploader" (change)="selectedFileOnChanged($event)" multiple />
        <div class="select_file" pDroppable="filesTo" 
          (onDrop)="drop($event)" [ngClass]="{'ui-highlight-car':draggedFile}"
          ng2FileDrop (onFileDrop)="fileDropOver($event)" [uploader]="uploader">
            <div class="selected" *ngFor="let selItem of selectedFiles">
                <div class="file_close" (click)="removeFile($event,selItem)">X</div>
                <div class="file_name">{{selItem.filename}}</div>
            </div>
        </div>
    </div>
    <div class="clr"></div>
    <button class="btn" (click)="doUpload()">Save</button>
</div>

3.目前的问题是:我的selectedFileOnChanged($event)这个方法,在ts文件中用event.target.files取得的内容一直是空
另外,我该如何把我上传的和拖拽的文件同时传到java后台,然后后台应该用什么方式去接收我传过去的数据?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文