title: Setting up Routing for Angular in a ASP.NET Web API 2 project
body: <p>So I'm trying to set up the routing for my project, I have a few different cases that need to be handled but I'm unable to make them work as intended.<br>
  case 1: / - Routes to the index of the angular app<br>
  Case 2: /{angular Route} - Routes to angulars routing but I'm guessing it first needs to be redirected to angular base page.<br>
  Case 3: /api/data/GetAllValues - Routes to the data api controller method and GetAllValues action<br>
  My base file for angular is stored at the root: <code>/index.html</code> but I have it so that when you go to this page angular will take you to <code>/Index</code></p>
  
  <p>This is the routing I have in <code>WebApiConfig.Register</code> which is invoked by the Global.asax</p>
  
  <pre><code>config.MapHttpAttributeRoutes();
  
  config.Routes.MapHttpRoute(
      name: "DefaultActionApi",
      routeTemplate: "api/{controller}/{action}/{id}",
      defaults: new { id = RouteParameter.Optional });
  
  config.Routes.MapHttpRoute("AngularRedirect", "{.*}", "~/index.html");
  
  config.Formatters.JsonFormatter.SupportedMediaTypes.Add(new MediaTypeHeaderValue("text/html"));
  </code></pre>
  
  <p>And Angular routes</p>
  
  <pre><code>.config(function($routeProvider, $locationProvider) {
      $routeProvider.when('/Index',
          {
              templateUrl: 'Templates/Feed.html',
              controller: 'feedController'
          }
      );
      $routeProvider.when('/Lookup',
          {
              templateUrl: 'Templates/Lookup.html',
              controller: 'lookupController'
          }
      );
  
     $locationProvider.html5Mode(true);
  
     $routeProvider.otherwise({ redirectTo: '/Index' });
  </code></pre>
  
  <p>I'm getting a few issues with this setup, neither case 1 or 2 work, both result in a message from asp.net with saying that it cannot match a url to the request<br>
  Edit: this is the error message when I try navigate to / (case 1)</p>
  
  <p><code>{"Message":"No HTTP resource was found that matches the request URI 'http://localhost:49569/'.","MessageDetail":"No route providing a controller name was found to match request URI 'http://localhost:49569/'"}</code>  </p>
  
  <p>Update:<br>
  I changed the asp.net default route to catch {.*} and now when I put in <code>/</code> it correctly redirects to angular but when I do <code>/Index</code> I am still gettign the error as below<br>
  <code>{"Message":"No HTTP resource was found that matches the request URI 'http://localhost:49569/Index'.","MessageDetail":"No route providing a controller name was found to match request URI 'http://localhost:49569/Index'"}</code></p>