title: SPA example with Web Api and AngularJS in typescript
body: <p>Currently trying to get my head around SPAs with AngularJS written in Typescript, but I have a hard time finding any good examples on how to get things working.</p>
  
  <p>I created a simple MVC5 application with a single 'main page' MVC controller (which, duh, delivers the main page including a layout) where I'm then bootstrapping angularJS and my app:</p>
  
  <h3>_Layout.cshtml</h3>
  
  <pre><code>&lt;html lang="en" ng-app="MyApp"&gt;
  ...
  @Scripts.Render("~/scripts/jquery")
  @Scripts.Render("~/scripts/angular")
  @Scripts.Render("~/scripts/ng-app")
  </code></pre>
  
  <h3>Client/MyApp.app.ts</h3>
  
  <pre><code>module MyApp {
  
      var dependencies = [
          "ngRoute"
      ];
  
      function configuration($routeProvider: ng.route.IRouteProvider) {
          $routeProvider
              .when("/", { templateUrl: "/" })
              .otherwise({ redirectTo: "/" });
      }
  
  }
  </code></pre>
  
  <p>This leads to the following error:</p>
  
  <pre><code>Failed to instantiate module MyApp due to:
  Error: [$injector:nomod] Module 'MyApp ' is not available!
  </code></pre>
  
  <p>The few examples I found yet load their applications using:</p>
  
  <pre><code>angular.module('todomvc', [])
      .controller('todoCtrl', TodoCtrl)
  </code></pre>
  
  <p>However my main reference application which I'm currently learning from does not: <a href="https://github.com/aspnet/MusicStore/tree/master/src/MusicStore.Spa" rel="nofollow">https://github.com/aspnet/MusicStore/tree/master/src/MusicStore.Spa</a></p>
  
  <p>So, how to get a simple application working with AngularJS and typescript and why does the ASP.NET MusicStore SPA example does not need to load AngularJS modules with angular.module?</p>