css - 解析背景颜色值时出错 - angularjs

Question

下面的代码，

<div style="background-color: {{ row.legend }}"></div>

执行得很好，

但是 komodo 编辑器显示错误为 Error in parsing value for 'background-color'

我尝试修改为:ng-style="'background-color': '{{ row.legend }}'" ，但功能中断。

如何解决此错误？

Answer 1

始终使用 ng-style over style with evaluation braces。

技术背景是一些浏览器会立即从 DOM 中删除无效的样式属性，因此即使它们届时有效，angular 也无法稍后更新样式属性。

在你的例子中

<div style="background-color: {{ row.legend }}"></div>

可以评估为

<div style="background-color: "></div>

放在第一位，因此从 DOM 中删除。如果 row.legend 之后采用有效值，angular 将无法相应地更新 DOM。

内置指令 ng-style 不会发生这种情况。

为了完整起见，我将重复@overexchange 的回答

后一种情况的问题是缺少大括号，所以解决方案是

<div ng-style="{'background-color': row.legend }"></div>