css - AngularJS 样式设置背景

Question

我有以下 Javascript 对象:

这个对象有两个属性:pesonalColor 和 personRoleColor我有一个名为 vm.colorSwitch 的标志，我将使用它来切换下方跨度的颜色。使用 personalColor 效果很好，但我不知道如何引入 personRoleColor 来在颜色之间切换。

非常感谢您的帮助!

<span ng-repeat="myObject in myObjects" style="width:{{myObject.percentage}}%; background:{{myObject.personalColor}}" class="progress-bar" />

Answer 1

ngStyle允许以编程方式使用样式属性。

<span ng-style="{
    background: vm.colorSwitch ? myObject.personalColor : myObject.personRoleColor, 
    width: myObject.percentage + '%'
}" ...></span>