javascript - MVC4 AngularJS Removing # From Urls In Areas Applications -

before posting question searched , tried out many examples well.

for problem there similar post not working too.

here structure of whole application:

here structure of admin area :

project has 2 applications 1 client , admin : admin managed through areas

i have used angular 1.3.5 , used inside areas.

the landing page index page of home controller path :- areas/admin/views/home/index.cshtml

layout _layout path : areas/admin/views/shared/_layout.cshtml

routeconfig.cs file of inside app_start folder :

namespace stockmanagment {     public class routeconfig     {         public static void registerroutes(routecollection routes)         {             routes.ignoreroute("{resource}.axd/{*pathinfo}");              routes.maproute(                 name: "default",                 url: "{controller}/{action}/{id}",                 defaults: new { controller = "home", action = "index", id = urlparameter.optional },                 namespaces : new []{"stockmanagment.controllers"}             );         }     } } 

adminarearegistration.cs

namespace stockmanagment.areas.admin {     public class adminarearegistration : arearegistration     {         public override string areaname         {                         {                 return "admin";             }         }          public override void registerarea(arearegistrationcontext context)         {             context.maproute(                 "admin_default",                 "admin/{controller}/{action}/{id}",                 new { action = "index", id = urlparameter.optional },                 new [] {"stockmanagment.areas.admin.controllers"}             );         }     } } 

html5mode removing # form url

myapp.config(["$locationprovider", function ($locationprovider) {     $locationprovider.html5mode(true); }]); 

base tag in _layout page:

<base href="/"> 

web.config code of admin areas

<rewrite>   <rules>     <rule name="main rule" stopprocessing="true">       <match url=".*" />       <conditions logicalgrouping="matchall">         <add input="{request_filename}" matchtype="isfile" negate="true" />         <add input="{request_filename}" matchtype="isdirectory"   negate="true" />       </conditions>       <action type="rewrite" url="/" />     </rule>   </rules> </rewrite> 

when try access admin side using url: http://localhost:8917/admin/home/index

it loads website @ : localhost:8917/

and if refresh page loads original content i.e client side home page.

where going wrong in ?

thanks in advance...

edit 1 :

i removed rewrite code in web.config used because saw in post

before using

myapp.config(["$locationprovider", function ($locationprovider) {     $locationprovider.html5mode(true); }]); 

and

<base href="@request.url.absolutepath" /> 

to access admin side home page url :- http://localhost:8917/admin/home/index#/

after adding above code :- http://localhost:8917/admin/home/

accessing categories page

categories before code :- http://localhost:8917/admin/home/index#/categories

categories after code :- http://localhost:8917/admin/home/categories

when refresh gives error

server error in '/' application. resource cannot found. description: http 404. resource looking (or 1 of dependencies) have been removed, had name changed, or temporarily unavailable. please review following url , make sure spelled correctly.

requested url: /admin/home/categories

i'm not sure why you're using rewrite rule, can imagine interfere routing trying mvc. suggest removing url rewrite rule web.config.

if want collection of routes map index action in admin area (so various urls go angular spa), use wildcard mvc route.

e.g.

// route override work angularjs , html5 routing     context.maproute(         name: "application1override",         url: "application1/{*.}",         defaults: new { controller = "application1", action = "index" }     );