Angular 角度材质:主题化标准控件

Angular 角度材质:主题化标准控件,angular,sass,angular-material2,Angular,Sass,Angular Material2,我为我的网站创建了我的自定义灯光主题(非常接近靛蓝粉色)。但是,对于一些控件,我希望使用完全不同的外观:假设下拉列表的标准外观是白色加灰色高光,我希望白色加蓝色高光。我找到了一种通过css重写的方法,但我想知道我是否可以通过主SCSS文件使用mixin(如用于自定义控件的mixin)来实现这一点。如果您想采用角度材质方式,可以在SCSS文件中定义多个主题(颜色托盘),并通过color=“primary”属性或color>使用它们=“yourCustomPallete”只需将主题单独导入特定的mi

我为我的网站创建了我的自定义灯光主题(非常接近靛蓝粉色)。但是,对于一些控件,我希望使用完全不同的外观:假设下拉列表的标准外观是白色加灰色高光,我希望白色加蓝色高光。我找到了一种通过css重写的方法,但我想知道我是否可以通过主SCSS文件使用mixin(如用于自定义控件的mixin)来实现这一点。

如果您想采用角度材质方式,可以在SCSS文件中定义多个主题(颜色托盘),并通过
color=“primary”
属性或
color>使用它们=“yourCustomPallete”

只需将主题单独导入特定的mixin,就像mixin
Angle material主题一样(基本上包括特定组件的所有主题的主题):

@包含mat按钮主题($my theme);
@包括mat卡主题(我的其他主题);
摘自
\u all-palete.scss

@mixin棱角材质主题($theme){
@包括垫芯主题($theme);
@包括mat自动完成主题($theme);
@包括垫按钮主题($theme);
@包括mat按钮切换主题($theme);
@包括mat卡主题($theme);
@包括主题($theme);
@包括垫子芯片主题($theme);
@包括垫桌主题($theme);
@包括mat datepicker主题($theme);
@包括mat对话框主题($theme);
@包括垫子扩展面板主题($theme);
@包括mat form字段主题($theme);
@包括垫网格列表主题($theme);
@包括垫图标主题($theme);
@包括mat输入主题($theme);
@包括mat列表主题($theme);
@包括菜单主题($theme);
@包括mat paginator主题($theme);
@包括mat进度条主题($theme);
@包括mat progress微调器主题($theme);
@包括mat收音机主题($theme);
@包括mat select主题($theme);
@包括mat sidenav主题($theme);
@包括垫子滑动切换主题($theme);
@包括垫滑块主题($theme);
@包括垫步进主题($theme);
@包括mat标签主题($theme);
@包括工具栏主题($theme);
@包括mat工具提示主题($theme);
@包括席子小吃店主题($theme);
}


  • color
    属性只接受三个值:
    primary
    accent
    warn