使用 Angular Renderer2 时何时进行清理

Question

当我在 Angular 中使用经过清理的字符串创建文本节点时，我意外地在输出中得到了 html 实体。
我通常会先对所有输入进行清理，然后再在 Renderer2 中使用它。

const text = '€£';
const safeText = this.domSanitizer.sanitize(SecurityContext.HTML, text) as string;
const child = this.renderer.createText(safeText);
const spanElement = this.renderer.createElement('span');
this.renderer.appendChild(spanElement, child);
this.renderer.appendChild(this.viewContainer.element.nativeElement, spanElement);          

生成的输出：

€£

在此处查看带有简单演示的 Stackblitz 。

像

createTextNode

或

innerText

这样的原生 DOM 方法可以安全使用，但由于

createText

方法的文档没有以任何方式提及使用什么底层代码或机制将文本添加到 DOM，因此我很不清楚什么是安全的，什么是不安全的......

所以问题：

createText

不需要消毒吗？ （这里几乎变成了反讽）
在 Renderer2 中使用内容之前，我如何知道何时对其进行清理？这有记录在某处吗？ 我可以相信今天安全的东西在 Angular 的下一个版本中也将是安全的吗？

---

注意：我知道我可以将我的代码更改为：

const invalidElementText = spanElement.innerHTML(safeText);

但我并不追求适用于这种特殊情况的替代代码。

Answer 1

如您所知，我们有

innerText

和

innerHTML

，因此第一个仅接受文本值，而第二个将接受 html 或文本。

所以你可以认为

createText

等同于

innerText

，因为文本永远不会被渲染，所以没有理由净化

createText

的内容。或者，当您插入 html (

appendChild

) 时，您可以在发送到渲染器之前清理 html