Можно ли изменить цвет отключенного активного 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

Здесь вы идете - CodePen

CSS

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

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

Markup

<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

Вы можете использовать метод часов для этого в угловом дежурить на переменных нг-модель, чтобы определить логику внутри него.