在内联样式中使用角度变量

Posted 2023-03-06

技术标签:

【中文标题】在内联样式中使用角度变量【英文标题】：Using angular variables in inline styles 【发布时间】：2018-02-09 13:57:03 【问题描述】：

我想使用我的 json 数组中的背景颜色，但这不起作用。

<td ng-repeat="menus in $scope.menuList">
    <button class="head-button" style="background-color:menus.color" ui-sref="menus.link">
        <md-icon>menus.icon</md-icon>
        <md-tooltip md-direction="top">menus.tooltip</md-tooltip>
        <div class="head-mini-text">menus.text</div>
    </button>
</td>

style="background-color:menus.color" 怎么不起作用？有一个更好的方法吗？

【问题讨论】：

How do I conditionally apply CSS styles in AngularJS?的可能重复 Multiple attributes in ng-style的可能重复 【参考方案1】：

您可以使用角度指令ng-style 动态更改背景颜色

HTML：

 <button class="head-button" ng-style="'background-color':menus.color" ui-sref="menus.link">

更多参考：https://docs.angularjs.org/api/ng/directive/ngStyle

【讨论】：

以上是关于在内联样式中使用角度变量的主要内容，如果未能解决你的问题，请参考以下文章