如何解决动态更改角形材质主题
我对Angle还是陌生的,并且想动态地更改角度材质主题,我知道如何通过制作scss文件来定义不同的主题,定义3种颜色,包括mat属性和功能,但是后来我添加了文件引用在angular.json中是静态的,但是如果我有很多自定义的角度材质主题,我想动态地引用css文件。
那么,有没有一种简便,快速且经过优化的方法来做到这一点?
PS我已经浏览了许多帖子和文档,但是在动态更改主题方面似乎有些混乱,例如,例如,如果我有切换然后如何引用不同的样式而不是默认样式?
任何答案都将得到感激.. !!
解决方法
一种解决方案是实时构建材质调色板。这些是必要步骤:
- 在CSS变量中定义调色板,然后访问它们。
- 将这些变量分配给实际的角度主题。
- 使用“ tinycolor”库,我们创建了一个服务来生成 基于颜色的调色板。
- 使用JavaScript,我们更新DOM中的CSS变量。
以下是一个示例:
https://stackblitz.com/edit/angular-material-theming-playground
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。