I've been experimenting with ngRoute and I'm facing an issue with templateURL not working as expected. The functionality works perfectly except for when I attempt to use templateURL.
Here are the 4 files involved:
test.html
<p>{{test}}</p>
test.js
angular.module("app")
.controller("testController", ["$scope", function($scope) {
$scope.test = 10;
}])
app.js
angular.module("app", ["ngRoute"])
.config(function ($routeProvider) {
$routeProvider.otherwise({"redirectTo": "1"})
.when("/1", {
"controller": "testController",
"template": "{{test}}"
})
.when("/2", {
"controller": "testController",
"templateURL": "test.html"
});
});
index.html
<!DOCTYPE html>
<html>
<body ng-app="app">
<div ng-view=""></div>
<script src="js/angular.js"></script>
<script src="js/angular-route.js"></script>
<script src="app.js"></script>
<script src="test.js"></script>
</body>
</html>
Upon navigating to http://localhost:5000/#/1, it correctly displays 10. However, on navigating to http://localhost:5000/#/2, it fails to display anything.