AngularJS html5Mode in IE9 stuck in refresh loop - angularjs

Our application is having problems when using html5Mode in IE9. I have commented out all our code except the router to ensure it is nothing to do with our code. There are no errors in the console except a warning stating "Document mode restart from Quirks to IE9 standards." We are using version 1.2.0 of AngularJS. It is working perfect in IE10+, Safari, Chrome and Firefox. Changing to html5Mode true fixes the refresh loop.

The problem was our back end controller. It was using logic to redirect, basically removing the # that the Angular router was adding. Angular was then adding the # back hence the refresh loop.

Have you added to declare the html is in html5 ?

Related

Angular ui router html5Mode false and accented URLs in chrome

I always use html5Mode true when using angular ui-router but for a project hosted on github pages, I can't activate this mode given that no server side redirection is possible. So lets go with uggly hashbangs # in URL ;)
My state
.state('app.root.elus', {
url : 'élus',
Displays in Chromium Browser URL bar :
/#/%C3%A9lus
But if I activate html5Mode, the URL displays correctly
/#/élus
In Firefox, in both modes, accents are correctly displayed ...
Would anybody have a beginning of explanation and solution ?

Firefox is not loading my7 angularjs bower_components

people!
I'm creating a site with AngularJS that is working fine on every single browser, except for Firefox.
When I use firebug, the console shows "400 Bad Request" errors while trying to get the bower_components for the modal and ui-router services.
Could you help me?
Thanks!
Already solved it, it was a problem of Firefox not reconizing / instead of .

Batarang on Chrome mobile devtools doesn't work

I'm debuggin a mobile application using Chrome devtools, I can inspect the device, network tab, console tab, etc are working fine, I can see the batarang tab AngularJS, when I click Enable the page is reload on the chrome mobile tab but the batarang tab don't show any kind of information.
Do you have any idea?
(source: vpsnotas.com)
It appears as though Batarang hasn't been updated to be compatible with the latest versions of AngularJS. Appears to be a duplicate of: batarang Chrome extension for AngularJS appears broken
Does the console show any errors or anything? That would be the first place I would look, as it will normally point you in the right direction of the issue.
I recently ran into an issue with loading Batarang on an angular app that I know was previous working. The console was throwing an $injector:modulerr error and the issue turned out to be with the ng-strict-di directive on the ng-app. After removing the ng-strict-di directive from the ng-app, the Batarang extension works fine.

Backbone routes break on refresh with Yeoman

I am building an app with Backbone and Yeoman. I am having an issue with the routing.
I have the following routes set up:
'test' : testMethod,
'' : index
I have set up pushstate:
Backbone.history.start({pushState: true});
I am using Chrome
If enter myApp.com#test the url changes to myApp.com/test and testMethod() fires correctly.
However if I try goto myApp.com/test directly or refresh after the browser has changed the url from # to / then I get a 404.
I am using the Yeoman built in server to test the pages. Could this be causing the issue?
I am not sure if you are using BBB within Yeoman. If you are, this should not be an issue. If you are not using BBB, this is a known issue. BBB has it's rewrite rules setup correctly to use pushstate, but yeoman's built in server does not seem to adopt this. You could edit your grunt.js file with your own rewrite rules to get pushstate working correctly. Some of the users in the above mentioned link have done this successfully.
When your app goes live, you will either need to serve those urls through your server or edit your rewrite rules to do the same. If the latter, and your application relies on SEO, SEO will suffer greatly.

AngularJS set up with Webstorm

I'm getting started with Angularjs and fallen at the first hurdle :-(
i've installed node (windows installer) and the webstorm ide. in webstorm i've installed the angularjs plugin and in the html typing 'ng' prompts all the ng templates in a dropdown, so this look ok.
cutting and pasting in the demo html5 (under the heading 'The Basics' at http://angularjs.org/) and running in webstorm and navigating to the file url (in firefox or chrome) however the angular statement '{{yourName}}' isn't binding at all - it's rendered out as a literal. Anyone know where i'm going wrong ?
The example on the home page was using protocol-less (or protocol-relative) URLs (http://www.paulirish.com/2010/the-protocol-relative-url/). While those are very handy, protocol-relative URLs don't play nicely with the file:// protocol in this case. Simply your browser is trying to retrieve AngularJS library from the local file system. To fix it you need to add protocol:
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js"></script>
Try prefixing the ng tag with data like data-ng-model.

Resources