Angular UI tree implementation

Question

Can any one provide with a plunker or any hint on how to use http://angular-ui-tree.github.io/angular-ui-tree/#/basic-example

with a json object like this

var list = [
            {
              "id": 1,
              "title": "Parent",
              "items": [
                {
                  "id": 11,
                  "title": "child of Parent",
                  "items": [{
                      "id": 12,
                      "title": "inner child of Parent",
                      "items": [],
                    }],
                },

              ]
            }
        ]

Welcome to stackoverflow. Please refer How to create a Minimal, Complete, and Verifiable example. Here you go stackoverflow.com/help/mcve and stackoverflow.com/help/how-to-ask. — user861594
– user861594, Commented Jun 30, 2016 at 5:38

ndequeker · Accepted Answer · 2016-12-21 11:51:04Z

1

We have a set of examples which can be seen on the website. You can view the data structure on the right hand side of every example.

See https://github.com/angular-ui-tree/angular-ui-tree/tree/master/examples

answered Dec 21, 2016 at 11:51

ndequeker

8,0187 gold badges64 silver badges94 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Chamilyan · Accepted Answer · 2016-06-30 05:42:24Z

0

Lets look at the block in question

<div ui-tree>
  <ol ui-tree-nodes="" ng-model="list">
    <li ng-repeat="item in list" ui-tree-node>
      <div ui-tree-handle>
        {{item.title}}
      </div>
      <ol ui-tree-nodes="" ng-model="item.items">
        <li ng-repeat="subItem in item.items" ui-tree-node>
          <div ui-tree-handle>
            {{subItem.title}}
          </div>
        </li>
      </ol>
    </li>
  </ol>
</div>

item.items is also an array.

You know because the li nested below it is an ng-repeat looping through the values in item.items as subItem.

edited Jun 30, 2016 at 5:42

answered Jun 30, 2016 at 5:36

Chamilyan

9,45310 gold badges40 silver badges68 bronze badges

Collectives™ on Stack Overflow

Angular UI tree implementation

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related