问题的原因是在Angular中，使用innerHTML属性时，内联样式（inline style）不起作用。解决方法是将样式放在一个类（class）中，并在全局的CSS文件中定义该类。如果将样式放在非全局的CSS文件中，将无法生效。

具体解决方法如下：

1. 在HTML中，将要插入的代码存储在一个变量中，例如：

this.someHtmlCode = '<div class="demo"><b>This is my HTML.</b></div>'

2. 在全局的CSS文件中（通常是styles.scss），定义名为demo的类，并设置背景颜色为蓝色：

.demo{
       background-color: blue;
   }

3. 如果将样式放在全局的styles.css文件中，这种方法是起作用的。但如果将样式放在非全局的CSS文件中，需要使用::ng-deep选择器。在my-angular-component.css文件中，使用如下样式：

.my-static-div ::ng-deep .my-dynamic-div { color: blue; }

4. 在my-angular-component.ts文件中，定义一个handleStaticClick方法，并在该方法中判断点击的元素是否包含my-dynamic-div类，如果包含，则调用handleDynamicClick方法。

其他解决方法包括在style.scss文件中定义一个名为mono的类，并在需要应用样式的元素中使用该类。

通过以上方法，可以解决在Angular中使用innerHTML属性时，内联样式不起作用的问题。

在Angular中，使用innerHTML绑定的HTML内容无法应用样式的问题。出现这个问题的原因是因为Angular假设通过[innerHTML]注入的代码不应该能够通过组件的样式表进行样式设置，这被认为是一个bug，但并没有得到妥善处理。解决这个问题的方法是取消组件的封装，通过设置encapsulation: ViewEncapsulation.None来实现。然而，这种方法无法识别CSS变量，例如var(--blue)。另一种解决方法是使用DomSanitizer服务对HTML进行安全处理，然后通过<div [innerHTML]="sanitizer.bypassSecurityTrustHtml(yourObject.note)"></div>来绑定HTML内容，并将DomSanitizer服务添加到构造函数中public sanitizer: DomSanitizer。但是需要注意防止XSS攻击的问题。这种方法可以解决无法识别CSS变量的问题。其中一个用户还提到了使用Vue2-editor时遇到类似问题，通过上述方法解决了添加颜色的问题。

在Angular中，innerHTML属性中的样式不起作用是正常的行为。这是因为默认情况下，封装是Emulated。这意味着Angular阻止样式在组件内部和外部进行干扰。

解决方法是在组件中将封装更改为None。这样，你就可以在任何地方定义类：在styles中或在单独的.css、.scss或.less样式表中（不重要），Angular会自动将它们添加到DOM中。

如果只传递样式而没有类，它不起作用。但是，我无法找到解决方法:) 但是我建议你不要在模板中混合使用内联样式，因为这不是一个好的实践。

你可以查看这个。

ViewEncapsulation是angular/core的一部分：import { ViewEncapsulation } from '/core';。

确保从/core导入ViewEncapsulation，而不是从/compiler/src/core。否则，你将遇到一个神秘的错误 - "Cannot find module 'tslib'"！

更改ViewEncapsulation为None可能会产生相当广泛的后果。这样会将样式应用于全局 - 所以如果你将div标签设置为具有背景颜色，这将改变应用程序中所有div的背景颜色。除非绝对必要，否则我会避免更改ViewEncapsulation。

该问题是关于使用显式内联样式，而不是类。

有没有不使用ViewEncapsulation.None的解决方法？

我们也可以在样式文件中使用::ng-deep，这样可以在不指定ViewEncapsulation.None的情况下完成工作（即保持Emulated作为默认值）。例如：（在组件的scss文件中）::ng-deep .demo {color: red}。

将Angular组件的封装设置为none不是一个好主意。将CSS类添加到全局CSS文件中（应在Angular.json中注册）将完美地工作。