sca-shared/t/menubar.html

SCA shared service

<script type="text/ng-template" id="menuitem.tmpl">
    <a href="{{page.url}}" ng-if="!page.submenu">
        <span ng-if="page.icon" ng-bind-html="page.icon" class="sca-item-icon"></span>
        {{page.label}}
    </a>
    <a href="javascript:void(0)" ng-if="page.submenu" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
        <span ng-if="page.icon" ng-bind-html="page.icon" class="sca-item-icon"></span>
        <span ng-if="page.label">{{page.label}}</span>
        <span ng-if="page._label">{{renderLabel(page._label)}}</span>
        <span class="caret"></span>
    </a>
    <ul class="dropdown-menu" ng-if="page.submenu">
        <li ng-repeat="subpage in page.submenu" 
            ng-if="subpage._show != false"
            ng-class="{active: active == subpage.id, divider: subpage.separator, 'dropdown-header': subpage.header}">
            <a href="{{subpage.url}}" ng-if="subpage.url">
                {{subpage.label}}
            </a>
            <span ng-if="!subpage.url && subpage.label">{{subpage.label}}</span>
        </li>
    </ul>
</script>

<nav class="sca-menubar navbar navbar-default navbar-static-top">
    <div ng-include="'menuitem.tmpl'"></div>
    <div ng-class="{'container-fluid': fluid, 'container': !fluid}">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <!--<div ng-transclude></div>-->
            <a ng-if="header" class="navbar-brand" href="{{header.url}}">
                <span ng-if="header.icon" ng-bind-html="header.icon" class="header-icon"></span>
                {{header.label}}
            </a>
        </div>
        <div id="navbar" class="navbar-collapse collapse">
          <ul class="nav navbar-nav">
            <li ng-repeat="page in menu" 
                ng-if="!isright(page) && page._show != false"
                ng-class="{active: active == page.id}" 
                ng-include="'menuitem.tmpl'"></li>
          </ul>
          <ul class="nav navbar-nav navbar-right">
            <li ng-repeat="page in menu" ng-if="isright(page) && page._show != false" ng-class="{active: active == page.id}"
                ng-click="go(page.url)" ng-include="'menuitem.tmpl'"></li>
          </ul>
        </div><!--/.nav-collapse -->
    </div>
</nav>