Angular Routing only works for one case

Question

So I'm trying to use angular routing for my project but it seems that only one route is working properly. I can access any of the routes if I used 'localhost/#/{{routeName}}' but everything except home returns a 404 error when I use the format 'localhost/{{routeName}}'. Here's my config

angular.module('shasta-water', ['search', 'ngRoute']).config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) { $locationProvider.html5Mode(true); $routeProvider .when('/', { redirectTo: '/home' }) .when('/home', { templateUrl: 'Templates/HomeTemplate.html' }) .when('/search', { templateUrl: 'Templates/SearchTemplate.html', controller: 'searchCtrl' }) .when('/add', { templateUrl: 'Templates/AddTemplate.html' }) .otherwise({ // templateUrl: 'Templates/ErrorTemplate.html' redirectTo: '/home' }); }]);

@Ties Yeah, I can get to the files using localhost/#/search and localhost/#/add but they don't work if I just localhost/search or localhost/add — Desquid
– Desquid, Commented Feb 25, 2016 at 15:16
you need to add some code to your server it understands your requests. Don't know ASP.NET myself but found this: stephenwalther.com/archive/2015/01/16/… — Ties
– Ties, Commented Feb 25, 2016 at 15:20

Community · Accepted Answer · 2017-05-23 12:23:25Z

You'll need to make sure the server also knows what do with these urls it receives requests for when you use HTML5 mode (without #) you can do this by:

Apache/PHP

Inside your .htaccess file in your root folder. Handle routes in index.php

RewriteEngine on RewriteCond %{REQUEST_FILENAME} -s [OR] RewriteCond %{REQUEST_FILENAME} -l [OR] RewriteCond %{REQUEST_FILENAME} -d RewriteRule ^.*$ - [NC,L] RewriteRule ^(.*) /index.php [NC,L]

From: https://stackoverflow.com/a/22740184/5171528

ASP.NET

 <!-- from https://stackoverflow.com/questions/25916851/wrapping-staticfilemiddleware-to-redirect-404-errors --> <configuration> <system.webServer> <modules runAllManagedModulesForAllRequests="true" /> <rewrite> <rules> <!--Redirect selected traffic to index --> <rule name="Index Rule" stopProcessing="true"> <match url=".*" /> <conditions logicalGrouping="MatchAll"> <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" /> <add input="{REQUEST_URI}" matchType="Pattern" pattern="^/api/" negate="true" /> </conditions> <action type="Rewrite" url="/index.html" /> </rule> </rules> </rewrite> </system.webServer> </configuration>

Collectives™ on Stack Overflow

Angular Routing only works for one case

1 Answer 1

Apache/PHP

ASP.NET

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Apache/PHP

ASP.NET

Comments

Linked

Related