title: Set default start page for Angular routing
body: <p>I would want main.htm to be the default page that comes up without having to type mysite.com/main.htm. I would prefer it comes up right with mysite.com. When I click on the Main link with the site below it does go to mysite.com (localhost right now as I'm using Visual Studio to run this) but that doesn't get routed to main.htm. How can I get main.htm to be the "default" page?</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;script src="Scripts/angular.js"&gt;&lt;/script&gt;
  &lt;script src="Scripts/angular-route.js"&gt;&lt;/script&gt;
  &lt;head&gt;
      &lt;base href="/" /&gt;
      &lt;title&gt;&lt;/title&gt;
      &lt;meta charset="utf-8" /&gt;
  &lt;/head&gt;
  &lt;body ng-app="myApp"&gt;
      &lt;p&gt;&lt;a href="/"&gt;Main&lt;/a&gt;&lt;/p&gt;
  
      &lt;a href="red"&gt;Red&lt;/a&gt;
      &lt;a href="green"&gt;Green&lt;/a&gt;
      &lt;a href="blue"&gt;Blue&lt;/a&gt;
  
      &lt;!-- below is where the partial pages will replace --&gt;
      &lt;div ng-view&gt;&lt;/div&gt;
  
  &lt;script&gt;
      var app = angular.module("myApp", ["ngRoute"]);
  
      app.config(function($routeProvider, $locationProvider) {
          $routeProvider
          .when("/", {
              templateUrl : "main.htm"
          })
          .when("/red", {
              templateUrl : "red.htm"
          })
          .when("/green", {
              templateUrl : "green.htm"
          })
          .when("/blue", {
              templateUrl : "blue.htm"
          });
  
          // note: when you do this you must have the &lt;base&gt; tag in the header as well
          $locationProvider.html5Mode(true);
      });
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>