Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

AngularJS Data Binding issue on Internet Explorer using Curly Braces

What am I doing wrong here? I've read through the IE Compatibility Guide but that doesn't mention data binding using {{}} tags. This works fine on other browsers but fails in IE (including IE9).

http://jsfiddle.net/yMgQ8/1/

HTML:

<html ng-app class="ng-app">

    <head></head>

    <body>
        <div ng-controller="Controller">
            <p>{{test}}</p>
        </div>
    </body>

</html>

JavaScript:

function Controller($scope) {
    $scope.test = "Hello world";
}

I've tried adding the steps mentioned in the compatibility guide but that doesn't seem to solve it, unless I'm missing something obvious!

It should output "Hello world", but on IE it outputs {{test}}.

Many Thanks.

like image 486
James Donnelly Avatar asked Aug 16 '12 09:08

James Donnelly


2 Answers

The problem appears not to be angular but jsfiddle

http://plunker.no.de/BL97Av/ this works in IE9

Also, IE7 or IE8 Compatibility you are on your own.

like image 115
Dan Doyon Avatar answered Nov 12 '22 00:11

Dan Doyon


For future reference; adding an id attribute to the html element solved my problem. In your case this would mean changing the code to:

<html ng-app id="ng-app" class="ng-app">
like image 2
downhand Avatar answered Nov 12 '22 00:11

downhand