I'm currently learning about .Net Core and AngularJS by following tutorials. However, I've encountered an error while attempting to implement client routing in the newest version of .Net Core with default configuration. The AngularJS error I received was: $injector:modulerr Module Error
To troubleshoot this issue, I created a separate project to focus solely on testing routing. Here is some sample code:
(function () {
'use strict';
angular.module('routeApp', ['ngRoute']).config(config);
function config($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
templateUrl: '/Views/home.html',
controller: 'HomeController'
})
.when('/about', {
templateUrl: '/Views/about.html',
controller: 'AboutController'
})
.otherwise({
redirectTo: '/'
});
$locationProvider.html5Mode(true);
};
})();
Here are the controllers used:
(function () {
'use strict';
angular
.module('routeApp')
.controller('HomeController', HomeController)
.controller('AboutController', AboutController)
.controller('ErrorController', ErrorController);
HomeController.$inject = ['$scope'];
function HomeController($scope) {
$scope.message = "Welcome homepage";
}
AboutController.$inject = ['$scope'];
function AboutController($scope) {
$scope.message = "This is about page";
}
ErrorController.$inject = ['$scope'];
function ErrorController($scope) {
$scope.message = "Error 404!";
}
})();
And here is the index.html file for reference:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>AngularJS Routing App</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular-route.js"></script>
<script src="app.js"></script>
</head>
<body ng-app="routeApp">
<a href="/">Home</a>
<a href="/about">About</a>
<div>
<ng-view></ng-view>
</div>
</body>
</html>
Can anyone help me identify what's causing this error? Do I need any specific server configurations?
PS. I'm using Visual Studio 2015 with Update 3.
PS2. Browser stack trace:
Uncaught Error: [$injector:modulerr] Failed to instantiate module routeApp due to:
Error: [$injector:unpr] Unknown provider: a
http://errors.angularjs.org/1.5.6/$injector/unpr?p0=a
...
PS3. Minified app.js
!function(){"use strict";function a(a,b){a.when("/",{templateUrl:"/Views/home.html",controller:"HomeController"}).when("/about",{templateUrl:"/Views/about.html",controller:"AboutController"}).otherwise({redirectTo:"/"}),b.html5Mode(!0)}angular.module("routeApp",["ngRoute"]).config(a)}(),function(){"use strict";function a(a){a.message="Welcome homepage"}function b(a){a.message="This is about page"}function c(a){a.message="Error 404!"}angular.module("routeApp").controller("HomeController",a).controller("AboutController",b).controller("ErrorController",c),a.$inject=["$scope"],b.$inject=["$scope"],c.$inject=["$scope"]}();