角度材料の無効なアクティブmdSwitchの色を変更することはできますか？

Question

角度のある材料md-switchを使用しています。マニュアルでは、スイッチが有効になっているときに色が変わっています。しかし、私はスイッチの色を変えるような機能が必要です。無効Activeです。これを達成するのを手伝ってください。前もって感謝します。

<md-switch aria-label="Switch 11" ng-class="{'md-checked':database.somevalue.value['alarm']}" 
 
      ng-disabled="true"> Alarm 
 
</md-switch>

Answer 1

ここに行く -​​

CSS

md-switch[disabled].activeDisabled .md-container > div 
{ 
    cursor: default; 
    background: lightgreen; 
} 

md-switch[disabled].activeDisabled .md-container > div > div 
{ 
    background: green; 
} 

マークアップ

<div ng-controller="SwitchDemoCtrl" ng-cloak="" ng-app="MyApp"> 
    <md-switch ng-class="{activeDisabled: data.cb1}" ng-disabled="true" aria-label="Disabled active switch" ng-model="data.cb1"> 
    Switch (Disabled, Active) 
    </md-switch> 

    <md-switch ng-class="{activeDisabled: data.cb2}" ng-disabled="true" aria-label="Disabled active switch" ng-model="data.cb2"> 
    Switch (Disabled, Active) 
    </md-switch> 

    <md-switch ng-class="{activeDisabled: data.cb3}" ng-disabled="true" aria-label="Disabled active switch" ng-model="data.cb3"> 
    Switch (Disabled, Active) 
    </md-switch> 
</div> 

JS

angular.module('MyApp',['ngMaterial']) 
.controller('SwitchDemoCtrl', function($scope) { 
    $scope.data = { 
    cb1: true, 
    cb2: false, 
    cb3: false 
    }; 
}); 

Answer 2

あなたは、その内部のロジックを定義するにはNG-モデル変数に時計を維持するための角度で、そのために時計の方法を使用することができます。