Angular 2 innerHTML无法处理slice或textarea

我有一个名为user.about的字符串，如下所示：

<p>Sed varius nisl id malesuada rutrum. Praesent sodales mattis rhoncus. Cras in sem a est euismod maxim us nec sed dui. Curabitur id nisl condimentum, sodales mauris eget, tempus felis.</p><p>Aenean in porttitor libero, vitae euismod dolor. Aliquam vel sagittis est, vitae volutpat nulla. Inte ger cursus sagittis erat at rhoncus. Sed blandit feugiat imperdiet. Nunc aliquam ut nunc eget accumsan. Nunc ut nisi eget augue aliquet porta a vitae justo.</p><p>Sed varius nisl id malesuada rutrum. Praesent sodales mattis rhoncus. Cras in sem a est euismod maxim us nec sed dui. Curabitur id nisl condimentum, sodales mauris eget, tempus felis.</p><p>Aenean in porttitor libero, vitae euismod dolor. Aliquam vel sagittis est, vitae volutpat nulla. Inte ger cursus sagittis erat at rhoncus. Sed blandit feugiat imperdiet. Nunc aliquam ut nunc eget accumsan. Nunc ut nisi eget augue aliquet porta a vitae justo.</p>

Sed varius nisl id malesuada rutrum。马蒂斯·朗卡斯苏打酒店。在sem中的CRA是一个非常好的例子。Curabitur id nisl调味品、sodales mauris eget、tempus felis.
自由港的埃尼安、尤伊斯莫·多洛（vitae euismod dolor）。阿利奎姆·维特·萨吉蒂，维特·维特·纳拉。在rhoncus有一个完整的箭头。塞德温文尔雅的封建统治。这是一个很好的例子。这是一种生活方式。
是一种生活方式。马蒂斯·朗卡斯苏打酒店。在sem中的CRA是一个非常好的例子。Curabitur id nisl调味品、sodales mauris eget、tempus felis.
自由港的埃尼安、尤伊斯莫·多洛（vitae euismod dolor）。阿利奎姆·维特·萨吉蒂，维特·维特·纳拉。在rhoncus有一个完整的箭头。塞德温文尔雅的封建统治。这是一个很好的例子。我们的生命之门在哪里

我尝试在两个不同的地方使用这个字符串，但是使用段落标记，我尝试在slice中使用这个字符串：

<p [innerHTML]="user.about">{{user.about | slice:1:150}}</p>

{{user.about | slice:1:150}

这根本不起作用

我还尝试在文本区域中使用innerHTML，如下所示：

<textarea name="about" [(ngModel)]="user.about" rows="7" class="area2" [innerHTML]="user.about">{{user.about}}</textarea>

{{user.about}

但这也不起作用。它显示段落标记，而我希望它们不具有段落标记，而是具有段落标记的间距

---

我做错了什么？

只需使用[innerHtml]或大括号，但不能同时使用两者，如果删除文本区域中的大括号，应该可以

---

另一方面，如果需要在段落标记内分割文本，则可能需要仅将文本分配给不同的变量

如果希望文本位于可编辑区域，则需要一个

contenteditable

元素

仅用于显示，只需使用

[innerHTML]

并正常调用

slice

（这些属性中没有“模板语法”）：

可编辑区域
带切片的段落

---

因为angular正在清理内容，使html标记成为“文本”，所以不会发生注入。

<h1>Editable area</h1>
<div contenteditable [innerHTML]="user.about"></div>

<h1>Paragraph with slice</h1>
<p [innerHTML]="user.about.slice(0, 150)"></p>