Aurelia Treeview on GitHub

- Developer and Blogger
Published: Sat Apr 11 2015

I have added a cleaned up version of my Aurelia treeview project to Github and here is a quick tutorial showing you how to use it.

The code for the treeview can be downloaded from Github

After downloading the dependencies all you have to do is add it to your page. In this example I have decided to wrap the treeview in a custom Aurelia component called test-treeview. The html and JavaScript files are shown below. You can specify your own folder structure, but this example assumes that the treeview files are stored in a folder named treeview.

test-treeview.html

<template> <require from="./treeview/tree-node"></require> <tree-node repeat.for="node of locations" current.bind="node"></tree-node> </template>

test-treeview.js

import {NodeModel} from './treeview/node-model'; export class TestTreeview{ constructor(){ var texas = new NodeModel('Texas',[new NodeModel('Houston'), new NodeModel('Austin')]); var newYork = new NodeModel('New York',[ new NodeModel('New York City', [ new NodeModel('Manhattan'), new NodeModel('Brooklyn'), new NodeModel('Bronx'), new NodeModel('Queens'), new NodeModel('Staten Island')]), new NodeModel('Buffalo')]); var oregon = new NodeModel('Oregon',[new NodeModel('Portland')]); var california = new NodeModel('California',[new NodeModel('Los Angeles'), new NodeModel('San Francisco')]); this.locations = [texas,newYork,oregon,california]; } }

I invite you to follow me on twitter