我有两条路线/书籍和/画作
我想在index.html中包含基于路线的链接标记
对于/ books路线,我想包括
<link rel="stylesheet" href="/assets/css/reading-theme.css" />
对于/绘画路线,我想包括
<link rel="stylesheet" href="/assets/css/gallery-theme.css" />
两个主题文件都有css,风格html背景不同
读theme.css
html, body {
background-color: #000;
box-sizing: border-box;
}
廊-theme.css
html, body {
background-color: #edb2b2;
box-sizing: content-box;
}
如果我将这些文件包含在相应组件的styleUrls中,就像这样
styleUrls: ['../../assets/css/reading-theme.css', './books.component.css']
css没有应用于html。
如何根据路线使用不同的主题文件?有没有像Title服务这样的服务可以用来动态设置链接hrefs?
提前致谢。
答案 0 :(得分:0)
如果您的风格基于路线,那么您应该只在组件上设置样式。
我看到你尝试过但失败了,因为那不是怎么做的。据我所知,只有一个html
和一个body
代码,它们不在您的组件中,而是在index.html
文件中。
这就是你的风格应该是这样的:
* {
background-color: #edb2b2;
box-sizing: content-box;
}
由于Angular封装了视图,因此此样式仅应用于您所处的路径(除非您更改封装)。