Angular DomSanitizer处理HTML字符串时自动添加额外标签问题

你用Angular的DomSanitizer调用sanitize(SecurityContext.HTML, value)处理<div><div>时，它自动补全成了<div><div></div></div>，这是因为这个方法的核心作用就是保证输出的HTML是合法结构——浏览器本身也不允许无效的不闭合标签存在，所以它会自动修复这类不完整的DOM，避免渲染出问题。

• 要是你只是想把标签当纯文本显示：把清理上下文换成SecurityContext.TEXT，这样所有HTML标签都会被转义成文本格式，比如<div><div>会变成<div><div>，直接在UI上显示原始的标签内容，代码改成：

  return this.domSanitizer.sanitize(SecurityContext.TEXT, value);
  

• 要是你必须保留不闭合标签且当作HTML渲染：DomSanitizer本身不支持这种操作，因为它的设计就是要确保HTML合法。这种情况只能自己先处理输入内容，再用bypassSecurityTrustHtml绕过安全检查（注意：必须确保输入内容绝对安全，不然会有XSS风险），示例代码：

  // 先按你的需求处理标签结构，再信任该HTML
  const handledValue = value; // 这里可以加你的自定义标签处理逻辑
  return this.domSanitizer.bypassSecurityTrustHtml(handledValue);
  

内容的提问来源于stack exchange，提问作者Utkarsh Singh