Javascript 如何使用angularjs值替换css类值？_Javascript_Html_Css_Angularjs

Javascript 如何使用angularjs值替换css类值？

javascript html css angularjs

Javascript 如何使用angularjs值替换css类值？,javascript,html,css,angularjs,Javascript,Html,Css,Angularjs,我现在有一个问题，使我的css值动态。我有这种代码，但不起作用 <style> .panel-primary { background-color:{{myColorPanel}} } </style> 如果希望使用AngularJs工作，ng类是最好的选择。您可以检查一下。希望这能为您提供问题的解决方案。我认为应该可以可能还有其他地方正在设置.panel primary上的背景色您正在使用引导，对吗？确保在引导的CSS之后加载自

我现在有一个问题，使我的css值动态。我有这种代码，但不起作用

<style>
    .panel-primary {
         background-color:{{myColorPanel}}
    }
</style>

如果希望使用AngularJs工作，ng类是最好的选择。

您可以检查一下。希望这能为您提供问题的解决方案。

我认为应该可以

可能还有其他地方正在设置

.panel primary

上的背景色

您正在使用引导，对吗？确保在引导的CSS之后加载自定义CSS。

下面我提供了一个简单的示例，说明如何切换类，而不是直接修改类，但是这不是一个非常典型的过程

函数MyCtrl（$scope）{
$scope.myClass='blue'
}

.blue{color:blue}
.red{color:red}


点击我！

如下所示，将样式标记放在控制器内部，而不是头部标记中

<body ng-controller="MainCtrl">
    Background of div is <input ng-model="name">
    <style>
      .p { background-color: {{name}}; }
    </style>
    <div class="p">dddd</div>
  </body>


div的背景是
.p{背景色：{{name}；}
dddd


angular.module（“myApp”，[]）.controller（“myController”，函数（$scope）{
$scope.name=“sagar”；
$scope.myColorPanel=“绿色”；
$scope.colorChange=函数（颜色）{
$scope.myColorPanel=颜色；
}
});
.小组初选{
背景色：{{myColorPanel}}；
}
{{name}，Angularjs的动态颜色更改
红色
蓝色
粉红色
黄色的

现在我发现了真正的问题。我使用的angularjs版本在风格上不支持angularjs。因为它是一个现有的系统，所以使用的angularjs是较旧的版本。我以前使用的版本是

1.2x

，然后我将其更新为较新的版本（

1.5x

），我使用的所有代码现在都正常工作。非常感谢你们的努力。我知道我没有意识到angularjs的版本是我的错，但是非常感谢你

解决方案正在从旧版本更改为新版本。

改用

ng类

…这意味着我将更改我使用的每个面板？没有其他更简单的方法了？那应该行得通。检查dom时是否看到正确的颜色？请使用此.panel primary{background color:{{{myColorPanel}}！重要；}。。。可能有重叠的任何其他类，所以使这一点很重要，然后检查你在哪里添加了上述代码？颜色应该来自我的数据库。

ng类

和

ng样式

没有问题，但问题是系统已经存在，并且使用了大量面板。所以我试着不做太多的改变，通过创建一个有值的类，这样所有的面板都会改变。面板主{background color:{{myColorPanel}}}（示例实例）如果可能，请创建一个plunker。在创建plunker的时候，你可能会找到解决方案。谢谢你的努力，伙计，但我的仍然一样，没有工作，我真的不知道为什么。

<body ng-controller="MainCtrl">
    Background of div is <input ng-model="name">
    <style>
      .p { background-color: {{name}}; }
    </style>
    <div class="p">dddd</div>
  </body>