angular中innerHTML的样式的问题

中的样式问题 会对css文件的样式进行处理

例如下图就是被处理过的样式

使用插入dom时标签都是原生标签，是无法匹配到css样式的，而且dom上的style样式也会被清除，所以内容是没有样式的。

但撒并不是意味着我们就无法给他设置样式，具体操作如下

在要插入的组件的ts的注解上面添加: .None,如下：

@Component({selector: 'app-article',templateUrl: './article.component.html',encapsulation: ViewEncapsulation.None,styleUrls: ['./article.component.css']
})

插入html 设置样式即可

查看样式

新的问题

虽然插入dom的样式解决了，但是新的问题也随之而来了，由于修改后的css内容不由进行特殊处理了，改css样式瞬间变成了全局样式，其他页面的样式也会因为你访问这个页面后而改变样式。所以这是一个不太合理的解决方案。特此记录。