javascript - AngularJS 文件浏览器

Question

我不确定如何以 Angular 方式进行此操作。

我想实现一个类似于下面的文件浏览器:example 1或 example 2

它应该实现的功能是:

• 显示当前目录下的文件和文件夹
• 能够单击文件夹以展开它们(如示例)

所以我现在拥有的是作为路径数组的文件和文件夹列表。这是由 onDrop 或 onChange 事件(来自拖放或输入)生成的。

关于如何实现这个有什么建议吗？

Answer 1

看看@angular-filemanager

FileNavigator.prototype.buildTree = function(path) {
    var self = this;
    var recursive = function(parent, file, path) {
        var absName = path ? (path + '/' + file.name) : file.name;
        if (parent.name && !path.match(new RegExp('^' + parent.name))) {
            parent.nodes = [];
        }
        if (parent.name !== path) {
            for (var i in parent.nodes) {
                recursive(parent.nodes[i], file, path);
            }
        } else {
            for (var i in parent.nodes) {
                if (parent.nodes[i].name === absName) {
                    return;
                }
            }
            parent.nodes.push({name: absName, nodes: []});
        }
    };

    !self.history.length && self.history.push({name: path, nodes: []});
    for (var i in self.fileList) {
        var file = self.fileList[i].model;
        file.type === 'dir' && recursive(self.history[0], file, path);
    }
};