小贝子编程

Rgba值不会以ng样式更新



我有一个div，它有一个ng风格的属性，rgba值，使用$scope变量的alpha值:

ng-style="{'background-color': 'rgba(255,0,0,{{ alphaValue / 100}})'}"

我有一个输入滑块，它改变了alphaValue的值。我可以使用console.log看到值的变化，并且rgba值正在html中的调试器中更新。它只是没有在视图中应用。

有什么建议吗?

看起来就像

ng-style="{'background-color': 'rgba(255,0,0,'+ (alphaValue/ 100) +')'}"

创建一个控制器方法获取样式对象。这是一个更简洁的方法。

ng-style="ctrl.getElementStyle(alphaValue)"
控制器

 ctrl.getElementStyle = function (alphaValue) {
        var alpha = alphaValue / 100;
        return {'background': 'rgba(255,0,0,' + alpha +')'};
  };

我怀疑您将需要使用控制器方法:

$scope.getRGBA = function(alpha){              
   return 'rgba(255,0,0,'+ alpha / 100 + ')';
}
HTML

ng-style="{'background-color':  getRGBA (alphaValue)}"

应该确保alpha也不是未定义的，并设置默认值

相关内容

最新更新


热门标签：

javascript python java c# php android html jquery c++ css ios sql mysql arrays asp.net json python-3.x ruby-on-rails .net sql-server django objective-c excel regex ruby linux ajax iphone xml vba spring asp.net-mvc database wordpress string postgresql wpf windows xcode bash git oracle list vb.net multithreading eclipse algorithm macos powershell visual-studio image forms numpy scala function api selenium