Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
  • How to create Navigation Menu in AngularJS

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 435
    Comment on it

    In the example below, I have built a navigation menu. Here I am using Angular directives to set menu button, when I will click on menu button It will display just below navigation menu bar.

    <div id="main" ng-app>
        <!-- The navigation menu will get the value of the "active" variable as a class.
             The $event.preventDefault() stops the page from jumping when a link is clicked. -->
        <nav class="{{active}}" ng-click="$event.preventDefault()">
            <!-- When a link in the menu is clicked, we set the active variable -->
            <a href="#" class="home" ng-click="active='HOME'">Home</a>
            <a href="#" class="projects" ng-click="active='projects'">Projects</a>
            <a href="#" class="services" ng-click="active='services'">Services</a>
            <a href="#" class="contact" ng-click="active='contact'">Contact</a>
                         <a href="#" class="help" ng-click="active='help'">Help</a>     
        <p ng-hide="active">Please click a menu item</p>
        <p ng-show="active">You chose <b>{{active}}</b></p>

 0 Comment(s)

Sign In

Sign up using

Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: