手动重新加载页面时，Angularjs路由不起作用

Question

I am trying to reload the page mannually from the browser but it doesn't work and says

 Cannot GET /rate/4

My route:

    angular.module('routing')

.config(function ($routeProvider, $locationProvider) {

    $routeProvider

    .when('/', {
        templateUrl: 'app/views/index.html'
    })

    .when('/rate/:cid', {
        templateUrl: 'app/views/rate.html'
    })


    .otherwise({
        'redirectTo': '/'
    });

    $locationProvider.html5Mode(true);

});

My assumption is that when I am reloading the main (index.html) is not loaded which is my base html file.

Answer 1

You do not have an angular problem, you have a server problem.

You're essentially working with a single page application.

When the server receives a request for rate/4 it must return index.html (or whatever the name that your main page is).

How you solve this will depend upon what platform you've implemented your server in.

For example, if you were running a node express server, you would have this kind of routing code:

app.get(/^\/rate\/.*/, function(req, res) {
    // This matches a known pattern for a client-side route
    res.sendFile(__dirname + '\\public\index.html');
});