md卡内容颜色变化

Question

    <md-card  class="md-padding" animate-on-change="currentCard" class="col-md-8" >
 <md-card-content>
 </md-card-content>
</md-card>

如何根据条件更改md-card或md-card-content的颜色？

如果currentCard.redAlert= true

，我需要更改颜色

Answer 1

使用ng-class指令，

<md-card-content ng-class="{mystyleclass : currentCard.redAlert == true}">
</md-card-content>


.mystyleclass{
    color: red;
    /*css code here*/
}

Answer 2

这是一种做法 - CodePen

标记

ARGIND==1

JS

<div ng-controller="AppCtrl" ng-cloak="" ng-app="MyApp">
  <md-card  class="md-padding" animate-on-change="currentCard" class="col-md-8" style="background:{{currentCard.redAlert?'red':'blue'}}" >
   <md-card-content>
   </md-card-content>
  </md-card>
  <md-button class="md-raised md-primary" ng-click="toggle()">Toggle</md-button>
</div>