1

I've got the following code and can't figure out, why It wouldn't load my test message.

At the moment I am doing this tutorial. Anyways, I really liked how an other guy implemented the scaffold in this tutorial.

Long story short, I've tried to combine those two approaches and failed ..

If I go to /index.html I just get a blank page.

When I debug it with the internet explorer, I get the following error message:

Unhandled exception at line 3809, column 9 in http://localhost:50367/Scripts/angular.js

0x800a139e - JavaScript runtime error: [$injector:modulerr] Failed to instantiate module TodoApp due to:

Error: [$injector:unpr] Unknown provider: $routeProvider

http://errors.angularjs.org/1.2.16/$injector/unpr?p0=%24routeProvider

   at Anonymous function (http://localhost:50367/Scripts/angular.js:3705:13)

index.html

<!DOCTYPE html>
<html ng-app="TodoApp" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script src="Scripts/jquery-1.10.2.js"></script>
    <script src="Scripts/angular.js"></script>
    <script src="Scripts/angular-resource.js"></script>
    <link rel="stylesheet" type="text/css" href="Content/bootstrap.css" />
    <!-- Custom Java Script files -->
    <script src="Scripts/app.js"></script>
    <script src="Scripts/controllers.js"></script>
    <title>Amazing Todo</title>
</head>
<body>
    <div class="container">
        <div ng-view></div>
    </div>
</body>
</html>

app.js

// Injects all the needed modules
var TodoApp = angular.module("TodoApp", [
        "ngResource",
        "TodoApp.controllers"
    ]).
    config(function($routeProvider) {
        $routeProvider.
            when('/', { controller: "listCtrl", templateUrl: 'list.html' }).
            otherwise({ redirectTo: '/' });
    });

controllers.js

angular.module('TodoApp.controllers', []).
    controller('listCtrl', function ($scope, $location) {
        $scope.test = "testing";
});

list.html

<h1>Hello: {{test}}</h1>
HansMusterWhatElse
  • 671
  • 1
  • 13
  • 34
  • 2
    Take a look at this answer http://stackoverflow.com/questions/18481863/failed-to-instantiate-module-injectorunpr-unknown-provider-routeprovider – rob Jun 06 '14 at 13:35
  • It works fine with Chrome and Firefox, but i still get an error with IE .. :-/ Unhandled exception at line 3809, column 9 in http://localhost:50367/Scripts/angular.js 0x800a139e - JavaScript runtime error: [$injector:modulerr] Failed to instantiate module TodoApp due to: Error: [$injector:modulerr] Failed to instantiate module ngRoute due to: – HansMusterWhatElse Jun 06 '14 at 15:29
  • Not sure why it's not working in IE but make sure you've done everything they suggest in the IE Compatibility guide: https://docs.angularjs.org/guide/ie – rob Jun 06 '14 at 17:12

0 Answers0