Ng-style with condition 使用条件的Ng-style
在使用ng-style指令时,有时候需要根据条件动态改变样式。然而,根据ng-style的设计,最好的做法是使用类来实现这一功能。但是,由于JavaScript具有返回最后一个值的能力,我们可以通过条件判断来实现动态样式的更改。
以下是一个示例代码:
<div ng-style="conditional && { 'background' : 'red' } || !conditional && { 'background' : 'green' }"> show me the background </div>
但是,如果我们在运行时更改条件,比如当点击一个按钮时更新条件的值,它并不会更新样式。尽管在检查中我们可以看到条件的更新值。
我仍然建议使用ng-class来处理这个问题,因为这是最好的方法。另外,你也可以通过改变ng-style的写法为ng-style="{'background' : Color.Background }"
,然后使用$scope.Color = { Background : "red" };
来改变背景颜色。