javascript - Angular JS : inline style with bound value works on mac not windows

标签 javascript html css angularjs ng-style

我用 ng-repeat 构建了一个表,显示了一个元素的类型规范,其中有一列“样本”:

enter image description here

如您所见,在 Mac Safari 和 Chrome 上运行良好。然而,在 IE 11/Win 8 上:

enter image description here

表格的行是这样的:

<tbody>
      <tr ng-repeat="item in type.header">
        <td class="{{item.extraclass}}">{{item.tag}} &ndash; {{item.font}}</td>
        <td>{{item.use}}</td>
        <td>
          {{item.tag}}{{item.class}}
          <span class="swatch" style="background-color:{{item.color}};color: #fff">{{item.color}}</span>,
          {{item.tag}}{{item.altclass}}
          <span class="swatch" style="background-color:{{item.altcolor}};color: #fff">{{item.altcolor}}</span>,
          {{item.tag}}.ko
          <span class="swatch" style="background-color:#fff; color:#2e2e2e">#FFFFFF</span>
        </td>
      </tr>
    </tbody>

出于某种原因,IE 似乎不喜欢内联样式标签。

在 safari 中检查代码看起来符合预期。您可以看到带有背景颜色和颜色的样式标签: enter image description here

但是在 IE11 中检查,一切都搞砸了。只有一种颜色,它是白色和 rgb: enter image description here

那么,为什么这适用于 Mac 而不是 IE?我对我的语法做了一些假设,但我已经尝试了一些东西,但到目前为止没有结果。

最佳答案

你需要使用ng-style:

<span ng-style="{'background-color':item.color, 'color': '#fff'}">

关于javascript - Angular JS : inline style with bound value works on mac not windows,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32276297/

相关文章:

jquery - 如何将数据标题属性添加到 jquery 数据表中动态添加的行?

javascript - 使用 mouseover() 时如何只允许出现一条消息

javascript - 使用 DOM 方法删除图像元素

javascript - 使淡入淡出效果在 "Fade Slider"上看起来更漂亮

javascript - 使用 html 标签 vs javascript 创建元素

javascript - 我是否应该使用 jQuery 对话框?

javascript - 如何在 javascript 中获取 td 内的包裹跨度的全宽

android - 修复了 Android 上的元素出现在屏幕外的问题

html - 如何将背景图像移到后面并将登录容器移到前面

javascript - 使表中的整行 float ,同时保持所有其他行就位