angular-ui-tree
Version:
An AngularJS UI component that can sort nested lists, provides drag & drop support and doesn't depend on jQuery
98 lines (85 loc) • 3.33 kB
HTML
<html>
<head>
<meta charset="utf-8">
<title>AngularJS UI Tree demo</title>
<!-- Stylesheets -->
<link rel="stylesheet" href="bower_components/bootstrap-css/css/bootstrap.min.css">
<link rel="stylesheet" href="source/angular-ui-tree.css">
<link rel="stylesheet" href="css/app.css">
</head>
<body ng-app="demoApp">
<div class="container">
<div>
<div class="jumbotron">
<h1>Tree component</h1>
<p class="lead">The AngularJS Tree component with drag and drop support.</p>
<p><a class="btn btn-lg btn-success" href="https://github.com/angular-ui-tree/angular-ui-tree" role="button">Code on
GitHub</a></p>
</div>
<div class="row">
<div class="col-md-4">
<h2>View Examples</h2>
<ol>
<li><a href="#/basic-example">Basic example</a></li>
<li><a href="#/filter-nodes">Filter nodes</a></li>
<li><a href="#/nodrop">Prevent drop</a></li>
<li><a href="#/connected-trees">Connected trees</a></li>
<li><a href="#/cloning">Cloning</a></li>
<li><a href="#/table-example">Table example</a></li>
<li><a href="#/drop-confirmation">Drop confirmation</a></li>
<li><a href="#/expand-on-hover">Expand parent node on drag hover</a></li>
</ol>
</div>
<div class="col-md-4">
<h2>What?</h2>
<p>
Angular Tree is an AngularJS UI component that can sort nested lists, provides drag & drop support and
doesn't depend on jQuery.
</p>
</div>
<div class="col-md-4">
<h2>Features</h2>
<ul>
<li>Uses the native AngularJS scope for data binding</li>
<li>Sorted and move items through the entire tree</li>
<li>Prevent elements from accepting child nodes</li>
</ul>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<h2>See it in action</h2>
<ng-view></ng-view>
</div>
</div>
</div>
<!-- JavaScript -->
<!--[if IE 8]>
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/es5-shim/3.4.0/es5-shim.min.js"></script>
<![endif]-->
<script src="bower_components/angular/angular.min.js"></script>
<script src="bower_components/angular-route/angular-route.min.js"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script src="source/main.js"></script>
<script src="source/controllers/handleCtrl.js"></script>
<script src="source/controllers/nodeCtrl.js"></script>
<script src="source/controllers/nodesCtrl.js"></script>
<script src="source/controllers/treeCtrl.js"></script>
<script src="source/directives/uiTree.js"></script>
<script src="source/directives/uiTreeHandle.js"></script>
<script src="source/directives/uiTreeNode.js"></script>
<script src="source/directives/uiTreeNodes.js"></script>
<script src="source/services/helper.js"></script>
<script src="js/app.js"></script>
<script src="js/basic-example.js"></script>
<script src="js/filter-nodes.js"></script>
<script src="js/cloning.js"></script>
<script src="js/connected-trees.js"></script>
<script src="js/table-example.js"></script>
<script src="js/drop-confirmation.js"></script>
<script src="js/expand-on-hover.js"></script>
</body>
</html>