Angular-Tree-View

Tree View API

branch-name

If set, specifies the property that will contain additional children.

• 1.0.5

• items

Example

<ea-tree-view ... branch-name="kids" ...></ea-tree-view>

angular.module('demo', ['ea.treeview']).controller('mainController', function($scope) {
    $scope.model.items = [
        {
            display: 'What to Show', kids: [
                {
                    display: 'A child display value', kids: [
                        {display: 'A grandchild display value'}
                    ]
                }
            ]
        }
    ];
});

callback

If set, specifies the name of the function on the root controller to invoke when an item is clicked.
The callback function accepts the item that was clicked as a parameter.

• 1.0.0

• N/A

Example

<ea-tree-view ... callback="go" ...></ea-tree-view>
angular.module('demo', ['ea.treeview']).controller('mainController', function($scope) {
    $scope.go = function(item) {
        console.log(item);
    }
});

dataset-id

Only necessary when multiple Tree Views are used in a single module.

If set, specifies the id to use to allow each Tree View within a single module to identify its own data without interfering with other Tree View controls

• 1.0.5

• N/A

Example

<ea-tree-view ... dataset-id="$id" ...></ea-tree-view>

is-root

Only necessary when using a single Tree View with a router (such as ui-router).

If set, specifies that the Tree View should be the root, which allows the router to properly expand the parents of a route and "select" the matching item based on the route.

• 1.0.0

• false

Example

<ea-tree-view ... is-root="false" ...></ea-tree-view>

items

The array containing the items to build the Tree View

• 1.0.0

Example

<ea-tree-view ... items="friggafromptons" ...></ea-tree-view>
angular.module('demo', ['ea.treeview']).controller('mainController', function($scope) {
    $scope.model.friggafromptons = [
        {
            display: 'What to Show', kids: [
                {
                    display: 'A child display value', kids: [
                        {display: 'A grandchild display value'}
                    ]
                }
            ]
        }
    ];
});

item-template-url

The URL of the template to use in the event you've created your own.

Note: Only one template may be specified for all Tree Views in the module. There is currently no way to specify a different template for each Tree View

• 1.0.5

Example

<ea-tree-view ... item-template-url="/templates/customItemTemplate.html" ...></ea-tree-view>