Source for the sf.treeRepeat module for AngularJS
Adds a pair of directives that can be used to display recursive (tree) data.
See http://blog.stackfull.com/2014/02/trees-in-angularjs/ for the back story.
Whether you build the component, copy the raw source or use bower (see below),
the end result should be included in your page and the module sf.treeRepeat
included as a dependency:
angular.module('myModule', ['sf.treeRepeat']);
Then use the directive sf-treepeat
and sf-treecurse
as follows:
<ul>
<li sf-treepeat="node in children of treeData">
{{node.name}}
<ul>
<li sf-treecurse></li>
</ul>
</li>
</ul>
Check out the examples in the demo folder for all the details.
Grunt is used as the build tool, so you will need
node and npm installed. Since v0.4,
grunt has 2 parts: the heavy lifting package grunt
and the shell command
grunt-cli
. If you haven't already installed grunt-cli
globally, do so now
with:
sudo npm install -g grunt-cli
To run the simple demo, install the npm dependencies for the build tools and go:
npm install
grunt demo
You can now view the demo at http://localhost:8000/
Build with grunt dist
and choose a file from the dist
directory.
For use with bower, there is a separate repo containing just the built artifacts here: angular-tree-repeat-bower. You can add the component to your project with:
bower install angular-tree-repeat
Or by adding a line to your component.json
file.
If you are using grunt
for your build, consider using a plugin like
bowerful.
All comments to [email protected]
Prototype