Dynamic menu using AngularJS

5

I have an application that has a menu at the top and another on the left side. The menu items should be filled with DB data according to the access profile. However, the menu is not being rendered when there is a change of route.

Shell.js:

<section>
 <div data-ng-include="'app/controllers/layout/header.html'"></div>
 <div id="menuDin" data-ng-include="'app/autenticado/menuDinamico.html'"></div>
    <div id="corpo" ng-view=""></div>
 <div data-ng-include="'app/controllers/layout/footer.html'"></div>
</section>
    
asked by anonymous 29.10.2014 / 18:34

1 answer

3

You can make an object available with its menu items by its controller and then use ng-repeat to draw the menu.

class MyCtrl
    constructor: ->
        @itens_menu = [ 
            {label: 'Menu1', href: 'url1'}, 
            {label: 'Menu2', href: 'url2'}
        ]


<ul ng-controller="MyCtrl as myctrl">
        <li ng-repeat="item in myctrl.itens_menu">
            <a href="{{item.href}}">{{item.label}}</a>
        </li>
</ul>
    
30.10.2014 / 13:19