1

I have a json like this:

  $scope.Menu = [
    { "MenuID": "1", "MenuTitle": "Scan", "MenuUrl": "/Test/Test", "MenuParentID": "0" },
    { "MenuID": "2", "MenuTitle": "Security", "MenuUrl": "/Test/Test", "MenuParentID": "0" },
    { "MenuID": "3", "MenuTitle": "PDF", "MenuUrl": "/Test/Test", "MenuParentID": "1" },
    { "MenuID": "4", "MenuTitle": "Doc", "MenuUrl": "/Test/Test", "MenuParentID": "1" },
    { "MenuID": "5", "MenuTitle": "Creat User", "MenuUrl": "/Test/Test", "MenuParentID": "2" },
    { "MenuID": "5", "MenuTitle": "PDF SUB", "MenuUrl": "/Test/Test", "MenuParentID": "3" }
];

I want to generate a N level tree based on this json. I tried following:

<section class="sidebar" ng-repeat=" ParentMenu in Menu">


        <ul class="sidebar-menu" ng-if="ParentMenu.MenuParentID == 0">


            <li class="active treeview">
                <a href="#">
                    <i class="fa fa-dashboard"></i> <span>{{ParentMenu.MenuTitle}}</span> <i class="fa fa-angle-left pull-right"></i>
                </a>
                <ul ng-repeat="ChildMenu in Menu" class="treeview-menu">
                    <li ng-if="ChildMenu.MenuParentID==ParentMenu.MenuID">
                        <a href="index.html"><i class="fa fa-circle-o"></i> {{ChildMenu.MenuTitle}}</a>
                    </li>
                </ul>
            </li>

        </ul>
    </section>

Its working for 2 level. I'm new to angular. How can I achieve this?

Improve this question
4
  • What result do you expect to get? Commented Nov 18, 2015 at 7:23
  • 2
    This is how: stackoverflow.com/questions/18415142/… Commented Nov 18, 2015 at 7:27
  • 1
    So what's the problem with that? It's unclear. Commented Nov 18, 2015 at 7:38
  • The problem is its working for only two levels, Like I can have PDF under the Scan Menu as expected but can't get the PDF Sub under PDF menu. I want it to be a dynamic one. Commented Nov 18, 2015 at 8:36
Related questions
6
Creating multi-level lists with ng-repeat
2
How can I dynamically generate a multi-level dropdown menu with angular?
6
Recursive menu directive
Load 7 more related questions Show fewer related questions

0

Reset to default

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.