动态加载CSS文件以进行主题设置 [英] Load css file dynamically for theming
本文介绍了动态加载CSS文件以进行主题设置的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有三个具有不同颜色主题的css文件,例如 theme1.css theme2.css theme3.css
I have three css files with different color themes e.g. theme1.css theme2.css theme3.css
我要根据所选类别加载它们. 是否可以在angular2中动态加载CSS文件? 处理此问题的正确方法是什么?
I want to load them depending on the selected category. Is it possible to load css files dynamically in angular2? What´s the proper way to handle this?
谢谢!
推荐答案
我不确定这是否正确.但是您可以尝试这样-
I am not sure if this is proper way. But you can try like this-
import { Component, Inject } from '@angular/core';
import { DOCUMENT } from '@angular/platform-browser';
@Component({
})
export class SomeComponent {
constructor (@Inject(DOCUMENT) private document) { }
LightTheme() {
this.document.getElementById('theme').setAttribute('href', 'light-theme.css');
DarkTheme() {
this.document.getElementById('theme').setAttribute('href', 'dark-theme.css');
}
}
参考: https://angular. io/docs/ts/latest/api/platform-browser/index/DOCUMENT-let.html
看看这是否有帮助.
这篇关于动态加载CSS文件以进行主题设置的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文