使用深色主题时如何为文本设置浅色前景色？

Question

我开始尝试使用 Angular Material（具体来说是 0.8.3 版本）。
从主题相关指令的代码和 mdThemingProvider 源代码中，我发现浅色前景是为深色主题定义的。但默认情况下，文本段落的文本仍然是深色的。
即使他们的 Input Demo 示例代码存在颜色问题。当您删除 title 和 e-mail 的内容时，输入字段占位符文本变为深灰色，因此几乎不可见。
我只是开始浏览他们的库源代码，无法找到如何主动更改段落和占位符的文本以进行对比。
通过简要查看 core/services/theming/theme.palette.js 文件，我发现了一些带有名称前缀 contrast 的调色板属性。所以我认为他们将颜色定义为在深色主题上可见。但是如何激活主题来使用它们呢？

有没有什么好的建议来归档深色主题的可读内容而无需进行许多额外的编码？
如果这不会破坏整个应用程序的动态变化主题（通过从 js 代码调用 $mdThemeProvider），那就太好了。

Answer 1

我也遇到了这个问题，通过设置主题的foregroundPalette，我能够令人满意地解决我的情况（Angular Material v0.9.6）：

myApp.config(function($mdThemingProvider) {
  $mdThemingProvider.theme('default')
    .dark()
    .foregroundPalette['3'] = 'rgba(255,0,0,1)';
})

您可以查看演示 here 并将其与 the original foreground 进行比较。这似乎没有公开记录，因此它可能是 AM 内部的，实际上它会改变您的整个应用的前景，即使您使用多个主题。

前景有四种色调，它们对于浅色和深色主题具有不同的值。以下是默认值（来自 AM 来源）：

var DARK_FOREGROUND = {
  name: 'dark',
  '1': 'rgba(0,0,0,0.87)',
  '2': 'rgba(0,0,0,0.54)',
  '3': 'rgba(0,0,0,0.26)',
  '4': 'rgba(0,0,0,0.12)'
};
var LIGHT_FOREGROUND = {
  name: 'light',
  '1': 'rgba(255,255,255,1.0)',
  '2': 'rgba(255,255,255,0.7)',
  '3': 'rgba(255,255,255,0.3)',
  '4': 'rgba(255,255,255,0.12)'
};

至于我为什么选择3，恰好是md-input-container使用的阴影，是我反复试验发现的。