Pioneer Tree: An Angular Tree Component

I have always had the need for a nice front-end Angular tree component and as up until recently, those needs were fulfilled by angular-ui-tree. Times have changed, I have upgraded most of my projects using AngularJS to Angular, and by way of was left to search for something new. After checking out what is already available in the Angular 4+ world, I decided none of them met my needs. That being said, I buckled down, disappeared for a month and created Pioneer Tree.

Pioneer Tree Demo

You can access a full feature demo located at the corresponding Pioneer Tree GitHub Pages page.


Pioneer tree is already full of features.

  • Intuitive markup defined by you.
  • Does not take dependencies on third party libraries.
  • UMD module loading with support for SystemJS.
  • Collapsible nodes
  • Selected node tracking
  • Opt-in public state tracking
    • Sort property
    • Parent Id property
  • Drag & Drop
  • Sort tracking
  • Event subscription
    • Add
    • Delete
    • Drop
  • Filtering
  • Public API
    • Expand All
    • Collapse All
  • Configuration
    • Default Collapse
    • Parameter Binding

What Does The Future Hold?

The goal moving forward is to continue adding relevant features and requests made from the community. To stay current on what is to come, be sure to visit the Issues page.

How Do I use It?

All current documentation on how to use Pioneer Tree is located at the Pioneer Tree Wiki. The actual Pioneer Tree package can be consumed through npm.

npm i @pioneer-code/pioneer-tree

Hey, can you...?

Did you find a bug, want a new feature, or are looking to contribute to Pioneer Tree? Awesome! Head over to the Pioneer Tree Issues page and let me know whats on your mind.