Javascript 是否有一种方法可以转义HTML字符串,然后以角度应用HTML标记?

Javascript 是否有一种方法可以转义HTML字符串,然后以角度应用HTML标记?,javascript,html,angular,typescript,dom,Javascript,Html,Angular,Typescript,Dom,我有一个Angular中的搜索表单,它从包含字符串数组的数据库接收对象。我使用管道将查询包围在的结果字符串中,该字符串将突出显示结果中的搜索查询,非常方便。到目前为止还不错 我现在尝试返回并突出显示包含html标记的html类型字符串的结果。 困难来了 仅仅显示结果数组将失败,因为Angular会自动清理HTML WARNING: sanitizing HTML stripped some content, see http://g.co/ng/security#xss 所以我在这里使用了一

我有一个Angular中的搜索表单,它从包含字符串数组的数据库接收对象。我使用管道将查询包围在
的结果字符串中,该字符串将突出显示结果中的搜索查询,非常方便。到目前为止还不错

我现在尝试返回并突出显示包含html标记的
html类型
字符串的结果。 困难来了

仅仅显示结果数组将失败,因为Angular会自动清理HTML

WARNING: sanitizing HTML stripped some content, see 
http://g.co/ng/security#xss
所以我在这里使用了一个角度安全的管道来绕过卫生设施:

此时HTML标记将呈现在结果中,这是不好的。 所以我构建了一个转义HTML管道来将HTML转换成字符代码

return value.toString().replace(new RegExp('/</g'), '&lt;').replace(new 
RegExp('/>/g'), '&gt;');
现在,我的转义html将显示在结果中,但高亮显示管道也将转义显示
query
,而不是高亮显示查询的文本


这里有没有什么方法可以得到我想要的东西(带有HTML标记的转义HTML字符串),或者我必须放弃高亮显示管道,在
清理
后只显示
转义HTML

几乎任何你想到的方法都会引入允许xxs注入的安全漏洞。最好的方法是将字符串分成3部分,开始、高亮显示和结束,并使用

{{start}}<mark>{{highlight}}</mark>{{end}}
{{start}{{highlight}{{end}}
{{result.value | safe: 'html' | escapehtml | highlight: 
this.search.get('query').value }}
{{start}}<mark>{{highlight}}</mark>{{end}}