我已经看到了大量的部分信息，但没有解释如何添加拖放上传到angular2的完整过程。我查看了 ng2-file-upload 和 angular2-file-drop 和 file-droppa 。它们都非常容易让前端工作，但是在后端没有任何解释，它是不可能完全实现的。
我最近的尝试是 file-droppa 。我真的很喜欢这个的外观和感觉。 （https://github.com/ptkach/fileDroppa）
所以我已将其部署到可以将图像拖入放置区域，看到缩略图显示并单击上载所有文件按钮。我所缺少的是在我的应用程序后端获取有关该文件的任何信息所需的魔力，以便能够实际上传它并对其执行任何操作。
我在后端使用NodeJS。调用/ upload的方法，但没有传递给它。
任何人都知道如何使这项工作？
assets.component.ts
import FileDroppa from 'file-droppa/components/Directives/FileDroppa';
@Component({
moduleId: module.id,
selector: 'pc-assets',
templateUrl: 'assets.component.html',
styleUrls: ['assets.component.css'],
directives: [FILE_UPLOAD_DIRECTIVES, NgClass, NgStyle, CORE_DIRECTIVES, FORM_DIRECTIVES, FileDroppa]
})
export class AssetsComponent implements OnInit {
@Input() asset:Asset;
@Input() uploads: Upload[];
constructor(private assetService: AssetService,
private errorService: ErrorService,
private http: Http,
private formBuilder:FormBuilder,
private uploadFileService: UploadFileService) { }
assets: Asset[] = [];
selectedAsset: Asset;
assetFilesToUpload: Array<File>;
assetUploaded = false;
assetUploadFile: any;
assetUploadObject: any;
uploadFile: any;
assetFileChangeEvent(fileInput: any){
this.assetFilesToUpload = <Array<File>> fileInput.target.files;
}
fileUploaded(success, response, file){
success && console.log("uploaded - awesome", response, file);
success || console.log("not uploaded - very bad", response, file);
}
}
assets.component.html
<fileDroppa
[url]="'http://localhost:3000/upload'"
[showFilesList]="true"
(fileUploaded)="fileUploaded($event)"
>
<!--<h1>-->
<!--You can pass anything you want here-->
<!--You can set you own file list here-->
<!--</h1>-->
</fileDroppa>