Menu made with ABP navigation system.

Author: hikalkan

Templates/All-In-One-Template/MySpaProject/MySpaProject.WebSpaAngular/App/Main/views/layout/layout.cshtml

@@ -11,8 +11,8 @@
         </div>
         <div class="collapse navbar-collapse">
             <ul class="nav navbar-nav">
-                <li ng-class="{active: activeMenu == route.config.menuItem}" ng-repeat="route in vm.routes">
-                    <a ng-href="#{{route.url}}">{{route.config.menuText}}</a>
+                <li ng-repeat="menuItem in vm.menu.items" ng-class="{active: '' == menuItem.name}">
+                    <a ng-href="{{menuItem.url}}">{{menuItem.displayName}}</a>
                 </li>
             </ul>
             <ul class="nav navbar-nav navbar-right">

Templates/All-In-One-Template/MySpaProject/MySpaProject.WebSpaAngular/App/Main/views/layout/layout.js

@@ -9,5 +9,7 @@
 
         vm.languages = abp.localization.languages;
         vm.currentLanguage = abp.localization.currentLanguage;
+
+        vm.menu = abp.nav.menus.MainMenu;
     }]);
 })();

Templates/All-In-One-Template/MySpaProject/MySpaProject.WebSpaAngular/App_Start/MySpaProjectNavigationProvider.cs

@@ -11,12 +11,14 @@ public void SetNavigation(INavigationProviderContext context)
                 .AddItem(
                     new MenuItemDefinition(
                         "Home",
-                        new LocalizableString("HomePage", MySpaProjectConsts.LocalizationSourceName)
+                        new LocalizableString("HomePage", MySpaProjectConsts.LocalizationSourceName),
+                        url: "#/"
                         )
                 ).AddItem(
                     new MenuItemDefinition(
                         "About",
-                        new LocalizableString("About", MySpaProjectConsts.LocalizationSourceName)
+                        new LocalizableString("About", MySpaProjectConsts.LocalizationSourceName),
+                        url: "#/about"
                         )
                 );
         }