title: AngularJS single page app - load default template and navigate to another page on login success
body: <p>Here I have 3 Pages
  Index.html,Login.aspx,MainPage.html
   when i run the Application it shows Login.aspx and when i enter the Credentials it Renders to MainPage.Here is My Snippet</p>
  
  <p>Index.html</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html data-ng-app="myApp"&gt;
  &lt;head &gt;
          &lt;script src="Scripts/angular.min.js"&gt;&lt;/script&gt;
      &lt;script src="Scripts/angular-route.min.js"&gt;&lt;/script&gt;
          &lt;script src="BaseController.js"&gt;&lt;/script&gt;
      &lt;title&gt;&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
       &lt;div data-ng-view=""&gt;   &lt;/div&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>and My Login.aspx</p>
  
  <pre><code>&lt;!DOCTYPE html data-ng-app="myApp"&gt;
  &lt;html &gt;
  &lt;head&gt;
      &lt;script src="Scripts/angular.min.js"&gt;&lt;/script&gt;
      &lt;script src="Scripts/angular-route.min.js"&gt;&lt;/script&gt;
          &lt;script src="BaseController.js"&gt;&lt;/script&gt;
      &lt;title&gt;&lt;/title&gt;
  &lt;/head&gt;
  &lt;body  &gt;
  
      &lt;div data-ng-controller="loginController"&gt;
  
      &lt;h3&gt;LOGIN&lt;/h3&gt;
      UserName:&lt;input type="text" data-ng-model="userName" /&gt; &lt;br /&gt;
      Password:&lt;input type="password" data-ng-model="password" /&gt;&lt;br /&gt;
      &lt;button type="button" data-ng-click="login()"&gt;Submit&lt;/button&gt;
          &lt;/div&gt;
  
  &lt;/body&gt; 
  &lt;/html&gt; 
  </code></pre>
  
  <p>and BaseController.js is </p>
  
  <pre><code>var app = angular.module('myApp', ['ngRoute']);
  app.config(['$routeProvider', '$locationProvider',
  function ($routeProvider,locationProvider) {
      $routeProvider
          .when('/', {
              templateUrl: 'Login.aspx',
              controller: 'loginController'
          })
      .when('/MainPage', {
          templateUrl: 'MainPage.html'
          })
      .otherwise({ redirectTo: '/' });
      $locationProvider.html5mode(true);
  }]);
  app.controller('loginController', function ($scope,$location) {
      $scope.login = function () {
          var uname = $scope.userName;
          var pwd = $scope.password;
          if ($scope.uname == 'admin' &amp;&amp; $scope.pwd == 'admin') {
              $location.path("/MainPage");
          }
      };
  });
  </code></pre>
  
  <p>when i Run the App i get Index page only...is there any mistakes..</p>