javascript - 无法使用角度js中的下拉菜单更改颜色

Question

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

Answer 1

这实际上是一个简单的修复，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 示例

---

解释：

选择选项中的值不是角度指令，因此myStyle被设置为字面意义上的“{color:'red'}”，而不是{"color":"red"}Angular 正在寻找并可以解析的 Javascript 对象ng-style。

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