Изменение цвета фона переключателя углового материала без потери пульсации

Как изменить цвет кнопки переключателя углового материала без потери эффекта пульсации?Изменение цвета фона переключателя углового материала без потери пульсации

Пожалуйста, смотрите код ручки здесь: http://codepen.io/shyambhiogade/pen/LpNGBP

Я изменил цвет на #03A9F4 и теперь Волновой эффект не работает должным образом ...

код ниже:

<div class="inset switchdemoBasicUsage" ng-controller="SwitchDemoCtrl" ng-app="MyApp"> 
    <md-switch class="md-primary" md-no-ink="" aria-label="Switch No Ink" ng-model="data.cb5"> 
    Switch (md-primary): No Ink 
    </md-switch> 
</div>

источник

2015-09-16 shyam_

просто удалить "мкр-не-чернил" атрибут из мда-кнопки, и изменить его на <мкр-переключатель класс = "мкр-первичный" ария-метку = "Switch No Ink" ng-model = "data.cb5"> – Shivi

Вам нужно использовать $mdThemingProvider провайдер для изменения стиля элементов.

http://plnkr.co/edit/FRwd2fmmn0byBVUKYKi9?p=preview

angular.module('MyApp', ['ngAria', 'ngAnimate', 'ngMaterial'], function($mdThemingProvider) { 
 
    var blueTheme = $mdThemingProvider.theme('blueTheme', 'default'); 
 
    var bluePalette = $mdThemingProvider.extendPalette('blue', { 
 
    '500': '#03A9F4' 
 
    }); 
 
    $mdThemingProvider.definePalette('bluePalette', bluePalette); 
 
    blueTheme.primaryPalette('bluePalette'); 
 
}) 
 

 
.controller('SwitchDemoCtrl', function($scope) {});

<html> 
 
<head> 
 
\t <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-material/0.11.0/angular-material.min.css"> 
 
    \t <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.6/angular.min.js"></script> 
 
\t <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-material/0.11.0/angular-material.min.js"></script> 
 
\t <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.6/angular-animate.min.js"></script> 
 
\t <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.6/angular-aria.min.js"></script> 
 
</head> 
 
<body ng-app="MyApp" md-theme="blueTheme" ng-controller="SwitchDemoCtrl"> 
 
    <div class="inset switchdemoBasicUsage"> 
 
    
 
    <md-switch class="md-primary" md-no-ink="" aria-label="Switch No Ink" ng-model="data.cb5"> 
 
    Switch (md-primary): No Ink 
 
    </md-switch> 
 
</div> 
 
</body> 
 
</html>

источник

2015-09-21 04:55:30

это, кажется, правильный способ внесения изменений, но эффект пульсации отсутствует, можете ли вы исправить это, и я помечаю его как ответ .. спасибо –

ОК, Я удалил md-no-ink и рябь работает ... –

Изменение цвета фона переключателя углового материала без потери пульсации

ответ

Смежные вопросы