title: ngRoute: cannot read property 'module' of undefined
body: <p>I have been trying to implement routing in my project but find it difficult to do so. Here is my index.html code</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  </code></pre>
  
  <p>
    </p>
  
  <pre><code>&lt;!-- Angular Material CSS now available via Google CDN; version 0.11.2 used here --&gt;
  &lt;link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.11.2/angular-material.min.css"&gt;
  &lt;script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular-route.min.js"&gt;&lt;/script&gt;
  &lt;!--&lt;script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular-route.js"&gt;&lt;/script&gt;--&gt;
  </code></pre>
  
  <p>
    </p>
  
  <pre><code>&lt;!-- Angular Material Dependencies --&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="./app/app.js"&gt;&lt;/script&gt;
  
  &lt;section ng-controller="MainCtrl"&gt;
    &lt;div ng-view&gt;&lt;/div&gt;
  &lt;/section&gt;
  
  
  &lt;!-- Angular Material Javascript now available via Google CDN; version 0.11.2 used here --&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.11.2/angular-material.min.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>
  </p>
  
  <p>and here is my app.js file:</p>
  
  <pre><code> (function(){
    "use strict";
  
    var app = angular.module('math_teacher', ['ngMaterial']);
    app.config(['$routeProvider', function($routeProvider){
    $routeProvider.
      when('/welcome',{
        templateUrl: 'welcome.html',
        controller: 'MainCtrl',
      }).
      otherwise({redirectTo: '/welcome'});
    }]);
  
    app.controller('MainCtrl', ['$scope', function(){
  
    }]);
    app.controller('TutorialsController', ['$scope', function(){
    }]);
  })();
  </code></pre>
  
  <p>and here is my welcome.html to test whether my route was working </p>
  
  <pre><code>&lt;h1&gt;Welcome to this page&lt;/h1&gt;
  &lt;p&gt;This really shows that the route is at work&lt;/p&gt;
  </code></pre>
  
  <p>on running this on my server here is what am seeing in my console:</p>
  
  <blockquote>
    <p>Uncaught TypeError: Cannot read property 'module' of undefined(anonymous function) @ angular-route.js:24(anonymous function) @ angular-route.js:6</p>
    
    <p>Uncaught Error: [$injector:modulerr] <a href="http://errors.angularjs.org/1.3.15/" rel="nofollow">http://errors.angularjs.org/1.3.15/</a>$injector/modulerr?p0=math_teacher&amp;p1=Er…gleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.15%2Fangular.min.js%3A38%3A135)(anonymous function) @ angular.js:38(anonymous function) @ angular.js:4138r @ angular.js:323g @ angular.js:4099ab @ angular.js:4025d @ angular.js:1452uc @ angular.js:1473Jd @ angular.js:1367(anonymous function) @ angular.js:26304a @ angular.js:2762c @ angular.js:3032</p>
  </blockquote>
  
  <p>Pls help</p>