user269867 user269867 - 1 month ago 15
AngularJS Question

angular route not working, throw page not found error

in index.html

<script src="lib/angular.min.js"></script>
<script src="lib/angular-route.min.js"></script>


controller

angular.module("testCtrl",[]).controller('TestController', ["$scope", function($scope) {
$scope.Myname = "my first route";
}]);


app.js

var app = angular.module('testApp',["ngRoute", "testCtrl"]);

app.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
$routeProvider

.when("/",{
templateUrl: "Views/main.html"
})
.when("/details",{
templateUrl: "Views/details.html",
controller : TestController
})
.otherwise({
redirectTo : "/"
});
}]);


my homepage loads fine but with some reason /details show error like --- No webpage was found for the web address: http://127.0.0.1:8080/details

I am new to angular and I am learning. I am not able to understand whats wrong ..do we have any tools to debug route error? I am using angular 1.5.8 version for now.

server console - "GET /details" Error (404): "Not found"

Answer

The issue is that TestController isn't defined in app.js. You should use the controller name as a string, like so.

    .when("/details",{
        templateUrl: "Views/details.html",
        controller : "TestController"
    })

See this plunk for a working example. https://plnkr.co/edit/xi20MmchJY6TO1SG2o0d?p=preview

Comments