gpt4 book ai didi

angular-material - 动态更改角度 Material Material 主题

转载 作者:行者123 更新时间:2023-12-04 12:36:57 31 4
gpt4 key购买 nike

我是 angular 的新手,想动态地更改 angular Material 主题,我知道如何通过制作 scss 文件来制作不同的主题,定义 3 种颜色,包括 mat 属性和功能,但后来我在 angular 中静态添加了该文件引用.json,但如果我有很多自定义的角度 Material 主题,我想动态地引用 css 文件。
那么有没有简单快速且经过优化的方法来做到这一点?
P.S 我已经浏览了许多帖子和文档,但是在动态更改主题时似乎很困惑,例如,如果我切换了,那么如何引用不同的样式而不是默认样式?
任何答案将不胜感激.. !!

最佳答案

一种解决方案是实时构建 Material 调色板。这些是必要的步骤:

  • 在 CSS 变量中定义调色板,然后访问它们。
  • 将这些变量分配给 Material 角度主题。
  • 使用“tinycolor”库,我们创建了一个服务来生成
    基于颜色的调色板。
  • 使用 JavaScript,我们更新 DOM 中的 CSS 变量。

  • 这里有一个例子:
    https://stackblitz.com/edit/angular-material-theming-playground

    关于angular-material - 动态更改角度 Material Material 主题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63731899/

    31 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com