在 Angular 4 中安全地在 innerHTML 上执行逻辑答案

【问题标题】：Safely Perform Logic on innerHTML in Angular 4在 Angular 4 中安全地在 innerHTML 上执行逻辑
【发布时间】：2018-03-27 17:27:54
【问题描述】：

如何安全地将以下内容转换为与 Angular 4 中的 [innerHTML] 一起使用？

<p class='blurb'>{{ (post.body.length > 500)? (post.body | slice:0:500)+'...':(post.body) }}</p>

【问题讨论】：

【解决方案1】：

我认为这是关于从 AngularJs 迁移到 Angular？

我会指出，您在那里发布的内容实际上并不是设置innerHTML，而是设置textContent。 textContent 总是被安全设置并且没有 xss 注入的可能性。不知道您为什么认为inneHTML 与此有关。

据我所知（而且我不太了解 Angular），但你在那里所做的应该以同样的方式工作。

也许显示你看到了什么错误和一个 plunkr？

【讨论】：

我的意思是，在 Angular 中，您可以使用 <p innerHTML="post.body"> 让 Angular 将 body 属性内的任何内容渲染为正确的 HTML。我正在尝试使用innerHTML 应用上述逻辑，但我不确定如何。