Изменение свойства css динамически с помощью AngularJS

Question

Я пытаюсь изменить цвет фона класса динамически, цвет, который я должен использовать, поступает из API. Я использую псевдо-элемент, потому что я хочу достичь, как this

<div class="despesas_interna"> 


        <a ng-class="{'status ': style(despesa.categoria_cor)}"> 

         {{despesa.data | amDateFormat:"DD/MM/YYYY"}} 
         <span>{{despesa.categoria_nome}} 
         <i class="ion-ios-arrow-right despesas_arrow"></i> 
         </span> 

         <p> 

          {{despesa.valor | moneyFormatBR}} 
          <span> </span></p> 
        </a> 

       </div> 

контроллер:

$scope.style = function(value) { 
      return { "background-color": value }; 
     } 

CSS:

.despesas_interna { 

    padding: 10px 10px 10px 15px; 
    font-weight: normal; 
    font-size: 15px; 

} 

.despesas_interna a:before { 
    content: ""; 
    display: block; 
    position: absolute; 
    width: 7px; 
    left: 0; 
    top: 0; 
    bottom: 0; 

} 

.despesas_interna a.status:before { 

    background-color: #87c424; 

} 

Answer 1

ng-style Используйте вместо ng-class. У вас есть два способа его использования:

<div ng-style="style(value)"> 

и

<div ng-style="{'background-color': value}">