选择并删除要解析的文件和/或文件夹

我在SO上使用了一个帖子的一部分（虽然我不记得了）来解析Chrome上的文件和文件夹，但我无法让它在Firefox上工作（老实说，我没有在其他人身上尝试过，尽管我认为它也不适用于safari）。

这是 2 个指令，ngDrop 和输入。

angular.module('myApp').directive("ngDrop", function($rootScope) {
    var link = function($scope, elements, attr, ngModel) {
        var parseInput = function(event) {
            var list = [];
            $scope.count = 0;
            var toParse = [];
            for (var i = 0; i < event.dataTransfer.items.length; i++) {
                toParse.push(event.dataTransfer.items[i].webkitGetAsEntry());
            }
            var traverse_directory = function(entry) {
                var reader = entry.createReader();
                // Resolved when the entire directory is traversed
                return new Promise(function executer(resolve_directory) {
                    var iteration_attempts = [];
                    (function read_entries() {
                        // According to the FileSystem API spec, readEntries() must be called until
                        // it calls the callback with an empty array.  Seriously??
                        reader.readEntries(function(entries) {
                            if (!entries.length) {
                                // Done iterating this particular directory
                                resolve_directory(Promise.all(iteration_attempts));
                            } else {
                                // Add a list of promises for each directory entry.  If the entry is itself
                                // a directory, then that promise won't resolve until it is fully traversed.
                                iteration_attempts.push(Promise.all(entries.map(function(entry) {
                                    if (entry.isFile) {
                                        list.push(entry);
                                        return entry;
                                    } else {
                                        return traverse_directory(entry);
                                    }
                                })));
                                // Try calling readEntries() again for the same dir, according to spec
                                read_entries();
                            }
                        });
                    })();
                });
            };
            var updateNgModel = function() {
                var files = [], count = 0;
                for (var i = 0; i < list.length; i++) {
                    list[i].file(function(file) {
                        files.push(file);
                        count++;
                        if (count === list.length) {
                            ngModel.$setViewValue(files);
                        }
                    });
                }
            };
            for (var j = 0; j < toParse.length; j++) {
                if (toParse[j].isFile) {
                    list.push(toParse[j]);
                } else if (toParse[j].isDirectory) {
                    $scope.count++;
                    traverse_directory(toParse[j]).then(function() {
                        $scope.count--;
                        if ($scope.count == 0) {
                            updateNgModel();
                        }
                    });
                }
            }
            if ($scope.count == 0) {
                updateNgModel();
            }
        }
        elements[0].ondrop = function(event) {
            event.stopPropagation();
            event.preventDefault();
            // ... styling
            parseInput(event);
        };
        elements[0].ondragover = function(event) {
            event.preventDefault();
        };
    };
    return {
        restrict: 'A',
        require:"^ngModel",
        link: link
    };
});
// select file on input
angular.module('myApp').directive("input", function($rootScope) {
    var link = function($scope, elements, attr, ngModel) {
        if (attr.type && attr.type.toLowerCase() === 'file') {
            elements[0].onchange = function(event) {
                var list = event.__files_ || (event.target && event.target.files);
                var files = [];
                for (var i = 0; i < list.length; i++) {
                    files.push(list[i]);
                }
                ngModel.$setViewValue(files);
            };
        }
    };
    return {
        restrict: 'E',
        require:"^ngModel",
        link: link
    };
});

关于实现，这就是我使用它们的方式：

<div class="dropzone" ng-model="files" ng-drop>
    <input type="file" ng-model="files" webkitdirectory multiple>
    <h2><i class="fa fa-upload"></i> Drop Images Here !</h2>
    <div>Or just click to select files.</div>
</div>

这两个指令主要用于填充 ngModel。

这是一个 plunkr

现在当我在FF中拖放时：TypeError: event.dataTransfer.items is undefined当我选择：TypeError: list is null

我可以更改什么才能使其同时在Chrome和Firefox上运行，为什么不同时在其他浏览器上运行？