Angular w / Angular Material – 对话主题被打破

发布时间：2020-12-17 17:29:49 所属栏目：安全来源：网络整理

导读：您好我在对话框组件中遇到Angular Material主题的问题,其中文本和其他组件的颜色不按照应有的方式工作. 在app.component中我有一个设置图标按钮,用于打开一个对话框main.settings.dialog但是当它打开时,如下图所示,着色不适合黑暗主题. 任何关于为什么这不能

您好我在对话框组件中遇到Angular Material主题的问题,其中文本和其他组件的颜色不按照应有的方式工作.

在app.component中我有一个设置图标按钮,用于打开一个对话框main.settings.dialog但是当它打开时,如下图所示,着色不适合黑暗主题.

任何关于为什么这不能以正常方式工作的见解将非常感激,因为我找不到解决这个问题的方法.

Live example site

Link to full source code

enter image description here

解决方法

由于您在样式类中包含主题,因此需要将其添加到全局覆盖容器中.

以下是您的AppModule中的方法：

import {OverlayContainer} from '@angular/cdk/overlay';

@NgModule({
      // ...
})
export class AppModule {
      constructor(overlayContainer: OverlayContainer) {
          overlayContainer.getContainerElement().classList.add('app-dark-theme');
      }
}

链接到官方文档：https://material.angular.io/guide/theming#multiple-themes

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!