Angular 13-从服务返回 HTML 并附加到文档后不应用 scss

Question

角13- 我有一个外部 html 文件，我在 Angular 组件中加载该文件。检索文件并且服务返回响应后，我将内容附加到 HTML。 问题是样式未应用于 scss 文件中。 我想要一种在服务返回响应时重新加载此 scss 文件的方法。

我尝试添加

setTheme(theme) {
    window.localStorage.setItem('theme', JSON.stringify(theme));
    this.theme = theme;
    let link = document.getElementById("css-theme");
    if(link) {
        link['href'] = this.theme.url;
    } else {
        let node = document.createElement('link');
        node.href = this.theme.url; // insert url in between quotes
        node.rel = 'stylesheet';
        node.id = 'css-theme';
        document.getElementsByTagName('head')[0].appendChild(node);
    }
}

但是，我想刷新角度组件中的scss文件，而不是在头部附加外部链接

Answer 1

SCSS 是一个 CSS 预处理器。 您不能为浏览器提供一个

.scss

文件并期望它能够正常工作。 如果您打算以这种方式切换样式，则链接的文件必须是

.css

文件。