latest Post

How to implement routing in AngularJS?

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'
            });
        }
    ]); 

About Mallikarjun A

Mallikarjun A
Recommended Posts × +

0 comments:

Post a Comment