Angularjs 使用ng样式更改背景颜色

如何使用ng样式更改背景色

这个Div会重复，所以其中一个颜色来自DB。对于plnkr，我刚刚修复了颜色，但在我的示例中是这样的：

<div class="col-md-offset-0 col-md-2" ng-repeat="type in types" style="margin-bottom:5px;">
       <div class='container' divCheckbox  ng-style="{'background-color':(isSelected?'{{type.color}}':'#ccc')}>
            <input type='hidden' ng-model="type.show" />
            <div class="label">{{type.name}}</div>
       </div>
</div>

---

这是我的建议：

您不能在标记中执行三元条件，并且您有一个错误，因为您没有引用

背景色。您必须引用它，或者使用camelCase，而条件应该在控制器中设置

因此，修复方法是使用一个表示颜色（或完整样式对象）的范围变量，并按如下方式使用它：


更新

下面是一个示例，您可以使用它使代码与数据库一起工作（我在这里调用外部JSON，但原理是一样的）：

这样，您也可以获取“选定”颜色。根据您提供的信息，我几乎只能告诉您这些。
您：

return {backgroundImage:'someimg'};

两者都是不同的风格。使用：

return {backgroundImage:'URL'};

或

Tks Shomz，只是一个问题，如何在指令中访问来自DB的数据（行正在侦听），因为颜色来自DB“{type.color}”，不客气。嗯，理想情况下，您可以向控制器中注入一个服务，并获取这样的数据（只需将颜色值分配给您在视图中使用的适当变量）。该服务将负责从DB.Shomz获取数据，只需将其更改为ng style=“{'background-color'：（isSelected？{{type.color}}'：'#ccc'）即可正如您所说，但由于某些原因无法工作。在控制台中，请不要给我任何错误。正如我所说，您不能在属性值内执行三元运算，应该在控制器中执行。请阅读我的答案。自版本1.1.5起，Angular在模板中支持三元运算符。
return {backgroundImage:'URL'};

return {backgroundColor:'Color'};