404 Error with Angularjs TemplateUrl Routing

[Joshua Schumacher]

I am trying to get angular to serve up a SPA in an MVC3 .Net Web App.  I keep get 'File Not Found - 404 Errors' though when I try to navigate inside the angular app.  

I'm using RouteProvider to load the templates and this is where the mistake must be. I just can't figure out why angular's routing can't find my html files.

Here is my StackOverflow question: http://stackoverflow.com/questions/20307655/404-error-with-angularjs-templateurl-routing

Thanks for any help or tips on how to troubleshoot this issue.

[Joshua Schumacher]

Attached is some specific code minus the extra stuff.

[Daniel Tabuenca]

I can’t say what the issue is specifically in your situation, but in general the way you would troubleshoot it is to check the following:

• Is the server configured to return the templates as static html? Verify this by constructing a url manually and loading it directly with a browser (not involving angular at all). You should be able to see the static html. This is a pre-requisite for anything else working. If this doesn't work then the problem is properly configuring .NET and server-side routing.
• If the you can get the first step to work, then start your angular app and open up the network tab of your browser’s development tool. If you see 404 requests note the URL. How is it different than the working URL you used above?
• If the URL is different, modify the templateUrl parameter accordingly so that it matches the correct URL.

If you are still having issues, post an example of the working URL and an example of what URL the browser is requesting when it gets a 404.

[Joshua Schumacher]

Here is a working URL for the problem app:  https://drive0.azurewebsites.net/demo

I'm using # on the Navigation Bar links so that the server side routing isn't called/used, but I'm still getting the 404 error.  Also the hash bang makes the url look wierd... https://drive0.azurewebsites.net/demo#/   Shouldn't there be a slash in there before the #?

[Daniel Tabuenca]

Start with the first step I gave you. Where is home.html on the server. Can you give me a working url for home.html?

[Joshua Schumacher]

TBH  I'm not sure, but I don't think so.  The angular SPA is located inside a View that is returned by the MVC controller DemoController.cs.  So using the previous url the app returns the view that has the angular app in it.  I read in other posts that using hashbang will keep the mvc app from using its routing.

 I feel like I'm messing this up badly because I'm trying to keep my MVC app alongside this angular framework.

--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/0PXqiJMkrwU/unsubscribe.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.

[Joshua Schumacher]

This is the request that angular is sending....

1. Request URL:
   https://drive0.azurewebsites.net/pages/about.html

[Joshua Schumacher]

I found a SO question that had to do with static urls and found out that having a root level folder named Static solved all of my problems.  It gives me a working url for the home.html.  Here is a link to that article.

Thank you so much for pointing me in the right direction.

[Daniel Tabuenca]

I'm glad you sorted it out. I think you are misunderstanding the hashbang though. Hashbangs aren't sent to the server so in that regards you are correct, they don't involve server routing. However, any request that DOES go to the server (through ajax $http or template lookups, etc...) will still go through the normal server routing. 

[Joshua Schumacher]

Ya, it kinda hit me when i looked at the request header and realized what was happening.  I'm excited again about angularjs. I thought for a moment that i was doomed to DOM manipulation and hundreds of partial views with kraken proportion javascript.  

On Sun, Dec 1, 2013 at 10:30 PM, Daniel Tabuenca <dtab...@gmail.com> wrote:

I'm glad you sorted it out. I think you are misunderstanding the hashbang though. Hashbangs aren't sent to the server so in that regards you are correct, they don't involve server routing. However, any request that DOES go to the server (through ajax $http or template lookups, etc...) will still go through the normal server routing.