材质角度:背景颜色不同的md-含量

Question

我有md角主题的定制。

$mdThemingProvider.theme('default')
    .backgroundPalette('customPallete', {
        'default': '200',
        'hue-1': '300',
        'hue-2': '500',
        'hue-3': '700'
});

其中customPallete -是我自己定义的调色板与自定义的颜色。

背景颜色'200‘是成功地应用于md-内容。但是我不能为其他组件再加上背景的颜色。例如，我想用一些数据创建另一个颜色块。这是代码

<md-content class="md-hue-3">
 ... some code here ...
</md-content>

但是背景是一样的，颜色是'100‘从默认配置的backgroundPalette。有人知道如何使用$mdThemingProvider定制不同背景色的块吗？

Answer 1

另一种方法是重新编译所需的样式：

angular
    .module("YourModule")
    .config(($mdThemingProvider: IThemingProvider): void => {
        // hack new features in angular-material
        $mdThemingProvider.registerStyles(`
            md-content.md-THEME_NAME-theme {
                color: '{{foreground-1}}';
                background-color: '{{background-color}}';
            }
        `);
    });

这样你就可以使用调色板上的所有“md X”了！