javascript - 使用 IE 在 Angular 模板中设置 HTML 样式时出现问题

Question

在 Internet Explorer 中对我的数据数组执行 ng-repeat 时，我在设置元素样式时遇到了问题。在 Safari、Chrome、Firefox 中一切正常，但出于某种原因，IE 不喜欢我做事的方式。

我正在为您将在下面看到的 ng-repeat 使用自定义过滤器

.filter('range', function() {return function(input, total) {total = parseInt(total);for (var i=0; i<total; i++)input.push(i);return input; };})

基本上，ng-style 中的任何内容都不会在 IE 中翻译。

<div ng-repeat="key in [] | range:documentData.info.pages">
    <div ng-if="(key+1) <= documentData.info.pages" ng-style="width:{{ documentData.style.width }}px;height:{{ documentData.style.height }}">
        <div class="formBackground" ng-style="background-image:url('/images/templates/{{ documentData.info.uid }}/{{ documentData.info.id }}/{{ (key+1) }}.png')">  
            Stuff
        </div>
    </div>
</div>  

Answer 1

您的问题可能是由您用来设置宽度和高度的字符串语法引起的。而是尝试使用对象文字语法，即 {width:widthProp, height:heightProp}。

即

ng-style="{width:documentData.style.width, height: documentData.style.height }"

和

ng-style="{'background-image':'url(/images/templates/{{documentData.info.uid}}/{{documentData.info.id}}/{{(key+1)}}.png)'}"