Angular tree-selector directive

Hierarchical (or tree) selector for AngularJS. It can either have the whole data structure (a tree) passed to it or set to asynchronously load each level via a callback. It also allows auto-complete searching of the tree, optional multiple selection and keyboard navigation.

Features

• Select data from a hierarchical/tree structure
• Asynchronously loading of children, or not
• Keyboard navigation

Build

To build this repository, you will need Node v6.11.5. For the changes to take effect, run npm run build here, merge the new build files (under release/) to master, and run bower update in the repositories where you need the changes.

Check it out

http://lukemurray.github.io/NgHierarchicalSelector/

Release notes

v0.4.0

• Added placeholder text functionality

v0.3.4

• Fix issue with input control not expanding with many selected items

v0.3.3

• Fix a post back issue for ASP.NET on some browsers

v0.3.2

• Fix an issue with when the selection attribute is null/undefined

v0.3.1

• Added in call back to get the tag name
• Ability to set the initial selected item.

v0.3

• Added in feedback about the async children loading
• Default button to show the tree on the right side of control. Use no-button attribute to hide it

TODO

• Tests
  • yep, should be writing these
• Docs
  • CSS customisation
• general
  • set up some repeatable way to do a release
  • add to bower
  • set up CI for the project
• tree
  • option for parent select selects all children
• autocomplete typing
  • allow typing at the end of the selected items
  • auto complete list for typing
  • no typing at the end if item selected and not multi select
  • support async for auto complete
• input control
  • remove selected items by keyboard
• tree
  • disabled items
  • option for no check boxes in multi select?
  • keyboard, left on a chile node should make the parent the active node
• popup
  • better positioning of popup when at bottom/edges etc.

Requirements

• AngularJS 1.3

CSS

.expando - Change the expand marker style .expando-opened - Change the collapse marker style

Contributing

Please do it.

Building

Gulp is used to build the project ('npm install' will install the gulp dependencies).

• gulp build will build is for local development
• gulp rel-patch will bump the version and build a release version
• gulp rel-minor will bump the version and build a release version
• gulp watch with run 'build' and watch for changes

Testing

...