For context, I work in an environment where I still need to support IE8 (still the default distribution on computers); I am also using twitter bootstrap 3; Angular is latest version. I am returning data from APIs and using ng-repeat to build the results in the view. Anyone out there developing applications in IE8 land? All my stuff is working stellar in Chrome.
I have 2 problems.
One is that in IE8, loading of the ng-repeat-driven API results takes forever or never finishes. If I open developer tools in IE8 and debug, on the refresh it loads the ng-repeat results fine. This happens every time.
Here's the beginning of my :
<!DOCTYPE html>
<html lang="en" ng-app="app">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
I have no idea why that is happening. Should I be using a different tag? I am wondering if IE8 Developer Tools loads items in a different IE8 mode than I have in the head. I am not clear on how I check the status of the API response in IE8 to verify that it is not a problem with the API call going out, rather than a problem of angular rendering the response.
The other issue is the ng-bind-html is not returning any values from certain fields of my API response in IE8. Working fine in Chrome. Is this a true alternative to ng-bind-html, and one that will work in IE8?
Since Stack Overflow won't let me answer or upvote the answer I found...This provides the solution to the ng-bind-html. Wasn't clear how you could apply that via a filter until I saw the answer that was not selected.
As for the other issue, I am going to go the route of an API call that does not include a data body (the API I am using can have the data come multiple ways). Case closed (in so much as I can move on...still plenty of unanswered questions.).
Related
I have written a frontend for Elasticsearch in AngularJS and it is working fine on Chrome and Firefox, but on some IE11 it is not working at all (some IE11 are working and some are not!)
Not working does mean:
Angular variables are not not interpreted at all and I get it as {{variable}}.
In gerneral my search engine does nothing (no controller call). It seems, that there is no AngularJS code executed at all and the site is a complete mess.
Any ideas?
update
I know, I had too less information but probably I am as confused with this issue as you.
Now I know, that IE11 always sets itself to "Document mode - 7" as shown in this question
How to set IE11 Document mode to edge as default?
There are probably two ways to solve this issue..
My html page can force IE11 to use lates "Document Mode", or
every single user hast to set "Document Mode" to the latest version (don't like that)
Solution
I added this
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
to my index.html to force IE11 to use its latest version, in this case edge
I'm using jstree v3.2.1 wrapped with ngJsTree in an AngularJS web-app to be used mainly on IE11 browsers.
I found that users who could not connect to the internet, due to their company policies, could not load properly the jstree I use within my forementioned web-app, on the other hand users who do access to the internet see everything just fine.
In particular the former users see just the spinner of jstree loading frozen and the "Loading..." text, which is strange because I set up the jstree config object to translate it into another string.
Moreover, I put a breakpoint inside the callback function associated to the ready event, and it never gets called.
Finally, the jstree part of my web-app works uber fine with both online and offline users when they reach it through Chrome or Firefox.
Is there any restriction on the online/offline usage of this library when in combo with some sort of IE11 strict security policy?
Thank you in advance
We had the same problem with IE11 in an environment without online access and custom security policies.
In our case the security policies somehow influenced the compatibility mode of IE which caused the problem.
After setting the compatibility mode manually in the Page header as described below everything works:
(After the Deployment we also needed to close and reopen the Browser, simply pressing refresh didn't change the compatibilty mode)
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=10; IE=9; IE=8;" />
I am currently using routeProvider to load a partial in the usually way. This works in Chrome, however, this does not work in Internet Explorer 11.
The links are in the form href="#/routehere", and it works when I manually paste the URL into the browser, but not when I click on the links.
What is going on here?
if you have missed this one
<html xmlns:ng="http://angularjs.org"> # Angular Docs says
OR you may try adding this to the header
<meta http-equiv="X-UA-Compatible" content="IE=8">
I am developing a webapp using angularjs. The webapp loads perfectly fine when the mobile device language is set to any except Chinese. I debugged a lot and found the issue that the web app is not loading because of the meta view port tag in the index.html. As soon as I remove the width and initial scale from meta viewport tag, the web app loads successfully in the mobile when the language is set to Chinese. navigator.language = "zh-CN" May I know the reason why this is creating problem when navigator.language is set to Chinese ? Is there any other alternate solution to make my webapp working?
Having the below meta tag in the index.html, doesn't render my app properly if language is set to Chinese
But if I remove the width and initial-scale, then the app renders properly if language is Chinese.
<meta name="viewport" content="maximum-scale=1.0, user-scalable=no, minimal-ui"/>.
I also tired a sample app, but the issue is observed there as well. Please see below my index.html where you can easily reproduce the issue in any Android phone. I tried in my S3 and also in a S4 device . Please help me on this issue. You can copy the below index.html and load it in your apache server to see the issue. The moment you remove the width and initial-scale from the DOM element, you can see the app loads perfectly.
Please help on this issue
Instead of setting initial-scale and/or user-scalable, try combining a minimum and maximum scale. For example:
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0" />
You don't need to use minimal-ui. Apple dropped support for this in iOS8.
It's never a good idea to set maximum-scale nor to set user-scalable="no" because it stops people from being able to zoom, which they may need to do.
It would be interesting to see what happens when you remove these and simply use the viewport:
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
I cannot see how the language would be causing this to happen, but it clearly is occurring, it sounds like a very interesting edge case.
Have you also tried other Chinese related lang settings such as "zh" or "zh-Hans"?
I also wonder if it's related to the font, and thus related to this question?
I'm trying to make my web application based on Angularjs work in IE8 and IE11.
After a lot of search, i am asking my question here: is it possible to make an Angularjs application work in IE11? and into IE11 ?
Thanks for advice
I had a problem while loading a angularjs file on IE. It worked perfeclty as expected on Chrome and Firefox but was giving error as angular not defined and what not. After searching on Internet I applied following fix to my code
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
and now it displays the page.
It should work and how you achieve that will depend on the application you are writing. Basically, you have to add extra codes to handle IE8. The AngularJS guide on IE should be a good place to start.
However, there could be situations where you run into problems. For example, when you want to use the "X-UA-Compatible" meta tag. An option could be to use the Google Frame plugin but Google has stopped updates on it from January 2014.
I think your question needs to be more precise about What is wrong with IE11?
I have personally created angularjs applications that works from IE8+ and on all other browsers like chrome, safari, firefox, opera. With all these browsers angular worked just fine.
It is important to mentioned that Microsoft broke the "Internet Explorer" inheritance meaning that internally IE11 is completely different from all other previous versions of IE but being the most advance version of Internet Explorer Angular does not need any particular "adaptation" to work with this browser.
If there is anything you should be worry it is IE8 :) and I am not saying this because of angular but because of IE8 itself.