index.html
1.81 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<!doctype html>
<html>
<head>
    <title>Angular Tree</title>
    <script src="demo/jquery.2.0.3.js"></script>
    <script src="demo/angular.1.2.29.js"></script>
    <script src="demo/ui-bootstrap-tpls.0.11.2.js"></script>
    <link href="demo/bootstrap.3.1.1.css" rel="stylesheet" type="text/css">
    <script src="angular-tree-control.js"></script>
    <link rel="stylesheet" type="text/css" href="css/tree-control.css">
</head>
<body ng-app="example">
<section id="classic" ng-controller="Classic">
    <treecontrol class="tree-classic"  tree-model="treedata"  on-selection="showSelected(node)">
        label: {{node.label}} ({{node.id}})
    </treecontrol>
    <div class="row">
        <tabset>
            <tab heading="Markup" >
                <pre class="code" apply-content="classic-html" highlight-lang="html"></pre>
            </tab>
            <tab heading="JavaScript">
                <pre class="code" apply-content="classic-js" highlight-lang="js"></pre>
            </tab>
        </tabset>
    </div>
</section>
<script>
    var example = angular.module("example", ["treeControl", "ui.bootstrap"]);
        function Classic($scope) {
        $scope.treedata=createSubTree(3, 4, "");
        $scope.showSelected = function(sel) {
            $scope.selectedNode = sel;
        };
            console.log($scope.treedata);
    }
    var names = ['Homer', 'Marge', 'Bart', 'Lisa', 'Mo'];
    function createSubTree(level, width, prefix) {
        if (level > 0) {
            var res = [];
            for (var i=1; i <= width; i++)
                res.push({ "label" : "Node " + prefix + i, "id" : "id"+prefix + i, "i": i, "children": createSubTree(level-1, width, prefix + i +"."), "name": names[i%names.length] });
            return res;
        }
        else
            return [];
    }
</script>
</body>
</html>