AngularJS Tree View Directive
File-explorer-like Tree view control for AngularJS and Bootstrap.
Using the Tree View
In your HTML:
<div tree-view="structure" tree-view-options="options"></div>
Where structure
is the JSON model containing the folders and files, and options
is the tree view configuration. If you don't provide any, the default configuration is used.
Example model and configuration:
$scope.structure = { folders: [
{ name: 'Folder 1', files: [{ name: 'File 1.jpg' }, { name: 'File 2.png' }], folders: [
{ name: 'Subfolder 1', files: [{ name: 'Subfile 1' }] },
{ name: 'Subfolder 2' },
{ name: 'Subfolder 3' }
]},
{ name: 'Folder 2' }
]};
$scope.options = {
onNodeSelect: function (node, breadcrums) {
$scope.breadcrums = breadcrums;
}
};