如何在 ngx-admin 主题中使用主题颜色

Question

我是 Angular 的新手，我正在尝试使用ngx-admin主题来学习它。它使用 Sass 进行样式设置，在我的一个组件中，我想设置 div 的背景颜色。但是我想使用主题提供的一种颜色，这样如果用户切换主题，颜色就可以改变。我无法弄清楚如何在组件的 scss 文件中使用主题的全局颜色。

这就是我要的

.product-container{
    background:#3d3780; // Instead of using a hard coded color, I want to use theme color here
} 

Answer 1

好的，我能够找到如何使用主题全局颜色。

首先需要通过导入导入全局主题样式

@import '~@nebular/theme/styles/theming';
@import '~@nebular/theme/styles/themes';

然后我可以像这样设置颜色

@include nb-install-component() {
    .product-container{
        background:nb-theme(color-bg);
    }
  }

我们需要将我们的样式包装在 @include nb-install-component() 调用中，以便在用户更改主题时刷新样式。

对于任何有兴趣进一步阅读的人，这里是该主题的官方文档。