Skip to content
Web Development Blog Logo
  • Angular 2
    • Typescript
    • Angular 4
  • Demos & Coding Examples
  • Tutorials
  • Online Tools
  • Useful Resources
  • Premium
  • Other
    • Angular Modules Tips
    • Angular Directives Tips
    • Angular Services Tips

5+ Premium and Free AngularJS Menus

Handsontable JavaScript Spreadsheet Most popular component for web apps
Sam Deering Sam Deering June 23, 2016 (updated June 23, 2016) Menu and Navigation
Angular 2 Book

Get Your Free Angular 2 Book Chapters

FREE eBook download plus get the Angular 4 exclusive freebies direct to your inbox.

Here are some popular AngularJS menus which I found useful.

1. Kapalak – Angularjs Based Sidebar Menu

Kapalak - Angularjs Based Sidebar Menu
Kapalak – Angularjs Based Sidebar Menu

Angular based sidebar menu. Most angular developers strugle to iterate their menu with json files and it will stop them using and making the menus more dinamic style. With this app you can make lot’s of user interactions and make something creative.

View Plugin View Code

2. ngMaterial Simple dropdown menu

ngMaterial Simple dropdown menu
ngMaterial Simple dropdown menu

Applying the md-menu-origin and md-menu-align-target attributes ensure that the menu elements align. Note: If you select the Redial menu option, then a modal dialog will zoom out of the phone icon button.

View Plugin and Demo

3. Multi Level Vertical Menu in AngularJS

Multi Level Vertical Menu in AngularJS
Multi Level Vertical Menu in AngularJS

Usually menus appear horizontally, with their submenus shown below their root menus. IntegralUI Menu directive for AngularJS comes with built-in feature that allows you to create a vertical menu where submenus appear on left or right side depending on whether left-to-right or right-to-left (RTL) layout is applied.

View Plugin and Demo

4. eeh-navigation AngularJS menu module

eeh-navigation AngularJS menu module
eeh-navigation AngularJS menu module

The eeh-navigation AngularJS module provides a configurable, responsive navbar and sidebar directive. It also contains a companion menu item configuration service. The directives support navigation of UI-Router states, ng-click binding, and ng-href links.

View Code View Demo

5. MacGyver macMenu

MacGyver macMenu
MacGyver macMenu

AngularJS directives and services for the greater good. Duct Tape and a Swiss Army Knife. Angular helpers for all your friends! A directive for creating a menu with multiple items. Menu allows for custom html templating for each item. Since macMenu is using ngRepeat, some ngRepeat properties along with item are exposed on the local scope of each template instance,

View Code View Demo

Categories: Menu and Navigation
Sam Deering

Sam Deering

Sam is a web developer, online entrepreneur and investor. In his spare time he enjoys coding, playing chess and sharing what he learns with others.

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Handsontable JavaScript Spreadsheet Most popular component for web apps
Blockchain Jobs

Related Posts

  • 4+ Angular 2 Floating Menus
  • 14 Angular 4 Menus Examples
  • 5 Angular 2+ Mobile Menu Demos (Hamburgers)
  • Top 5 Menu and Navigation AngularJS Modules
  • Hello world!
Web Development Blog Footer Logo
  • About
  • Privacy Policy
  • Subscribe
  • Contribute
  • Contact Us
  • Sitemap

Angularjs4u.com is not endorsed or certified by AngularJS. All AngularJS logos and trademarks displayed on this blog are property of AngularJS. The views expressed on here are purely to help other developers use AngularJS.

AngularJS 4U | 2023