无法在angular js中使用下拉菜单更改颜色

unable to change color using dropdown in angular js

本文关键字：下拉菜单 颜色 angular js      更新时间：2023-09-26

这是我正在处理的plunker。现在的问题是，我可以在示例1中更改颜色，但无法在示例2中更改颜色。
提前感谢。

这实际上是一个简单的修复，让myStyle更像是myColor类型的声明，在ng-style上有{{'color':myColor}}表达式：

<select ng-model="myColor">
    <option value="">none</option>
    <option value="red">Red</option>
    <option value="green">Green</option>
</select>
<div ng-style="{'color':myColor}">
    <p>Text to change color</p>
</div>

下面是一个jsFiddle示例

解释：

select选项中的值不是angular指令，因此myStyle被设置为字面上的"｛color:'red'｝"，而不是angular正在查找并可以在ng-style中解析的Javascript对象{"color":"red"}。

由于"｛color:'red'｝"的字面值看起来像对象，因此您不会注意到Chrome AngularJS扩展batarang中的差异。但如果你运行console.log()，你会发现不同之处。

相关文章：