使用 AngularJs 和 HTML 的样式属性在 IE 中不起作用

Question

<head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
</head>

<body>
    <div ng-app="myApp" ng-controller="myCtrl">
        <div style="color:{{color}}">Testing</div>
    </div>
    <script>
        var app = angular.module('myApp', []);
        app.controller('myCtrl', function($scope) {
            $scope.color = "#996600";
        });
    </script>
</body>

颜色属性在 IE 中不工作，但 chrome 和 firefox 工作

Answer 1

尝试使用 ng-style 指令：

https://docs.angularjs.org/api/ng/directive/ngStyle

Answer 2

不要使用 {{}} 的表达式，而是使用 ng-style 指令。

<div ng-style="{color: color}">Testing</div>

Angular 在使用 style 时出现问题。 Refer

Answer 3

这是更新后的代码：

<body>
<div ng-app="myApp" ng-controller="myCtrl">
    <div ng-style="{color:color}">Testing</div>
</div>
<script>
    var app = angular.module('myApp', []);
    app.controller('myCtrl', function($scope) {
        $scope.color = "#996600";
    });
</script>

因为你正在使用 angularJs 你需要定义 ng-style

Answer 4

style 是 HTML 属性，而 ng-style 在 Angular 属性中。所以请使用下面的符号

<div ng-style="{color:color}">Testing</div>

如果需要angular通知

<body>
   <div ng-app="myApp" ng-controller="myCtrl">
      <div ng-style="color:{{color}}">Testing</div>
   </div>
</body>

使用 AngularJs 和 HTML 的样式属性在 IE 中不起作用

Style properties not working in IE using AngularJs and HTML

javascript

angularjs

angularjs-directive