chuloon chuloon - 1 month ago 9
TypeScript Question

How to: Refresh AngularJS Route

I'm trying to create a Typescript SPA project through Visual Studio and I'm using AngularJS to handle the routing. Here's my config...

var app = angular.module("myApp", ["ngRoute"]);
app.config(($routeProvider, $locationProvider) => {
$routeProvider
.when("/", {
templateUrl: "/pages/index/index.html"
})
.when("/about", {
templateUrl: "/pages/about/about.html"
})
.otherwise({ redirectTo: '/' });

$locationProvider.html5Mode(true);
});


This is working fine, as it makes the URLs look how I want. However, when I go to refresh the page, I get an error 404 or error 403 depending on whether it's the main page or the about page. How do I go about making it so it refreshes to the correct page?

Answer

It's is a server-side thing, your server is handling your entire url as if it was a normal path in the server. You must configure this to target index.html always otherwise your server will try to find the www.myserver.com/about page. There for, it will produce a 404 status code because your url couldn't be found or is forbidden to access in case of a directory.