2015-10-16 3 views
1

У меня возникли проблемы с использованием пользовательских палитр с ракурсом с угловым материалом. Я все еще не понимаю, как использовать пользовательскую тему.Как использовать пользовательские палитры с ракурсом с угловым материалом

В угловом конфигурационном файле.

$mdThemingProvider.definePalette('crmPalette', { 
    '50': 'fafafa', 
    '100': 'ffcdd2', 
    '200': '000000', 
    '300': 'e57373', 
    '400': 'ef5350', 
    '500': 'f44336', 
    '600': 'e53935', 
    '700': 'd32f2f', 
    '800': 'c62828', 
    '900': 'b71c1c', 
    'A100': 'ff8a80', 
    'A200': 'ff5252', 
    'A400': 'ff1744', 
    'A700': 'd50000', 
    'contrastDefaultColor': 'light', 
    'contrastDarkColors': ['50', '100', '200'], 
    'contrastLightColors': undefined 
}); 

$mdThemingProvider.theme('crmPaletteTheme') 
    .primaryPalette('crmPalette'); 

В Просмотреть файл

<div md-theme="crmPaletteTheme"> 
    <md-button class="md-raised">Login</md-button> 
</div> 

У меня есть вопросы, чтобы спросить

После определения пользовательской темы, как использовать «fafafa» и «ffcdd2», что назначить цвет фона и цвет на кнопку md.

+0

http://graphicdesign.stackexchange.com/questions/43021/what-exactly-are-googles-500- color-swatches/44453 # 44453? newreg = 15496e3dff6c404ba6d5e93e8aaaed7b –

ответ

0

попробуйте это.

angular.module('App', ['ngMaterial']).config(
function ($mdThemingProvider) { 

    $mdThemingProvider.definePalette('colormaterial', { 
     '50': '14f9fc', 
     '100': '1949a8', 
     '200': 'ef9a9a', 
     '300': 'e57373', 
     '400': 'ef5350', 
     '500': 'f44336', 
     '600': 'e53935', 
     '700': 'd32f2f', 
     '800': 'c62828', 
     '900': 'b71c1c', 
     'A100': 'ff8a80', 
     'A200': 'ff5252', 
     'A400': 'ff1744', 
     'A700': 'd50000', 
    }); 
    $mdThemingProvider.theme('default') 
     .primaryPalette('colormaterial') 
}).controller('appController', function ($scope) { 

}); 

в HTML

 <md-input-container class="sin-margin ancho-total-element"> 
      <md-button md-colors="{'background-color': 'colormaterial-100'}" class="md-raised md-primary" type="submit"> Inicie Sesión </md-button> 
     </md-input-container> 

Я попробовал это, и это работает

+0

Ой, 8 месяцев назад ... в любом случае, спасибо, предлагаю, я попробую это = D – tommychoo

+0

Я пробовал и отлично работает. Но я обнаружил, что, когда я использую свой собственный пример палитры на кнопке, если я использую также ng-disabled, значок не станет серым цветом, как с палитрой по умолчанию. Возможно, вы найдете ту же проблему. –

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