Angular2使textarea按Enter而不添加新行

Posted 2023-05-07

【中文标题】Angular2使textarea按Enter而不添加新行

【英文标题】：Angular2 make textarea press enter without new line added

【发布时间】：2016-08-17 19:02:15

【问题描述】：

我有一些文本输入的文本区域。 当用户完成输入时，我让他们使用 [Enter] 通过

来确认文本

<textarea #msgInput (keyup.enter)="confirmText(msgInput.value)" >
</textarea>

虽然我可以成功获取confirmText() 中的文本。 在 textarea 的值上创建一个换行符。

如何正确地将换行符放到 textarea 中？ 我知道在编写 js 时存在一些方法，如 return 0 和 preventDefault() 但我不知道如何在 Angular2 打字稿中做到这一点。

【参考方案1】：

在表达式中添加;false 以抑制默认行为：

<textarea #msgInput (keydown.enter)="confirmText(msgInput.value);false" >

您还必须使用keydown 而不是keyup，因为取消keyup 为时已晚。

Plunker example

【讨论】：

请注意，“取消 keyup 为时已晚”对于诊断 Angular 8 中 @HostListener 的默认设置非常有用。