将Angular 4 contenteditable div输入绑定到HTML输出

我尝试接受用户输入，并在contenteditable div元素中动态呈现HTML等价物

这似乎只在输入来自div而不是div内容本身时才起作用，这会导致糟糕的体验，因为您必须在其他地方编写，然后在其他地方预览

至于我尝试使用自己的div文本并动态呈现HTML，我面临着光标位置在每次按下键时返回到起始位置的问题，以及由于未知原因只有一个元素呈现为HTML的问题。我不介意另一种方法，因为我知道最重要的是能够编写HTML标记并在同一个容器中呈现它们

<div [innerHTML]="HTMLvalue" (input)="HTMLvalue=$event.target.innerText" contenteditable="true" >

</div>