我知道AngularJS可以实现文件上传,但是我研究了一下发现没有提供上传整个文件夹的功能。 我正在使用ASP.NET Core。
请问AngularJS是否支持文件夹上传?如果不行,欢迎提供其他替代方案。 同时,我想知道在ASP.NET Core中FolderBrowserDialog的等价物是什么。
我知道AngularJS可以实现文件上传,但是我研究了一下发现没有提供上传整个文件夹的功能。 我正在使用ASP.NET Core。
请问AngularJS是否支持文件夹上传?如果不行,欢迎提供其他替代方案。 同时,我想知道在ASP.NET Core中FolderBrowserDialog的等价物是什么。
webkitdirectory
}}属性,使标准input
元素具备处理目录的能力:<input
#folderInput
type="file"
(change)="filesPicked(folderInput.files)"
webkitDirectory
>
function filesPicked(files) {
for (let i = 0; i < files.length; i++) {
const file = files[i];
const path = file.webkitRelativePath.split('/');
// upload file using path
...
}
}
属性webkitRelativePath
,顾名思义,包含了文件相对于用户选择的祖先目录的路径。
同一File and Directory Entries API的另一个部分是DataTransferItem.webkitGetAsEntry()
,它返回一个FileSystemFileEntry
或FileSystemDirectoryEntry
。如果它是一个目录,你可以通过调用FileSystemDirectoryEntry.createReader()
来获取FileSystemDirectoryReader
并读取它。下面是处理拖放事件的简要示例:
function drop(event) {
const items = event.dataTransfer.items;
for (let i = 0; i < items.length; i++) {
const item = items[i];
if (item.kind === 'file') {
const entry = item.webkitGetAsEntry();
if (entry.isFile) {
return new Promise((resolve, reject) => {
entry.file(
file => {
resolve(file);
},
err => {
reject(err);
}
);
});
} else if (entry.isDirectory) {
const directoryReader = entry.createReader();
return new Promise((resolve, reject) => {
directoryReader.readEntries(
entries => {
resolve(entries);
},
err => {
reject(err);
}
);
});
}
}
}
}
我的同事写了一篇简短的文章,更详细地解释了这种方法(免责声明:我在那家公司工作)。
这是文章中的完全可用的Plunkr演示:https://plnkr.co/edit/rFC9Ln
ng-file-upload是一个广为人知的AngularJS文件上传模块。
它可以处理多个文件上传,但不确定是否完全符合您的要求。
这是链接...
https://github.com/danialfarid/ng-file-upload/blob/master/README.md#user-content--usage