Angular app throws 404 error on github.io

I wrote a pretty simple app and put it up on github so I can watch it on the net. But it looks like the problem is with the URL (or maybe something else!). The only way I can get it to work on localhost is to use the # symbol in my navbar and use a regular url (no # ) in my config:

<ul class="nav navbar-nav navbar-right">  
    <li ng-class="{ active: isActive('/')}"><a href="/#/">Home</a></li>
    <li ng-class="{ active: isActive('/games')}"><a href="/#/games">Games</a></li>
    <li ng-class="{ active: isActive('/contact')}"><a href="/#/contact">Contact</a></li> 
</ul>


app.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
    $routeProvider
    .when('/', {
        controller: 'Posts',
        templateUrl: 'controllers/posts.html'
    })
    .when('/games', {
        controller: 'Games',
        templateUrl: 'controllers/games.html'   
    })
    .when('/contact', {  
        controller: 'Games',
        templateUrl: 'controllers/contact.html' 
    })
    .when('/:id', {  
        controller: 'Games',
        templateUrl: 'controllers/reviews.html'
    })
    .otherwise({
        redirectTo: '/'
    });
}]);

      

But it doesn't work on github.io, only on the first page. When I press the button games

it shows

404 file not found

although of course I have all the html files in the controllers folder.

+3


source to share


1 answer


Do you have extra /

in href's

Remove the master as it points to go to the root domain

<a href="/#/contact">Contact</a>

      



Should be:

<a href="#/contact">Contact</a>

      

This leaves you with only the hash in the href

+1


source







All Articles