Question

我有一个div如下：

<div class="circle-icon"><span class="icon icon-loanaccount"></span></div>

此div标记具有以下样式：

.circle-icon {      
  background: #db552d none repeat scroll 0 0;      
  width: 50px;
  &::after{
    border-bottom: 5px solid #db552d;
    content: "";
    height: 0;
    position: absolute;        
  }&:before{
     border-bottom: 5px solid #db552d;
     content: "";
     height: 0;        
   }      
}

如何使用angular动态调整border-bottom样式，假设我想要在scope.borderColor中使用我想要的颜色？

Answer 1

ng-style是您的朋友，请点击此处working link。

$scope.bordercolor = "thick dotted #ff0000";

<div class="circle-icon" ng-style ="{'border-bottom': bordercolor}">
    <span class="icon icon-loanaccount"></span>
</div>

使用angularjs动态设计伪元素

1 个答案: