top button
Flag Notify
    Connect to us
      Site Registration

Site Registration

How to implement routing in AngularJS?

0 votes
443 views

Routing is a core feature in AngularJS. This feature is useful in building SPA (Single Page Application) with multiple views. In SPA application, all views are different Html files and we use Routing to load different parts of the application and it's helpful to divide the application logically and make it manageable. In other words, Routing helps us to divide our application in logical views and bind them with different controllers.

routing

How to add routing

The$routeProvider definition contained by the module is called "ngRoute". In app.js file, I have defined an angular app using “angular. Module” method. After creating module, we need to configure the routes. The "config" method is used to configure $routeProvider. Using "when" and "otherwise" method of $routeProvider, we can define the route for our AngularJS application.

var app = angular.module("AngularApp", ['ngRoute']);  

app.config(['$routeProvider',  

    function($routeProvider)  

    {  

        $routeProvider.  

        when('/page1',   

             {  

                templateUrl: 'Modules/Page1/page1.html',  

                controller: 'Page1Controller'  

            })  

            .  

        when('/page2',   

             {  

                templateUrl: 'Modules/Page2/page2.html',  

                controller: 'Page2Controller'  

            })  

            .  

        otherwise  

        ({  

            redirectTo: '/page1'  

        });  

    }  

]);  

posted Sep 28, 2017 by Shivaranjini

  Promote This Article
Facebook Share Button Twitter Share Button LinkedIn Share Button

...