javascript - Angular:更改输入事件的值

Question

我有文本区域。我尝试将值的宽度限制为 10 个符号。我正在尝试减少 input 事件的值。

<textarea [(ngModel)]="smsMessage" (input)="changeSMSMessage()"></textarea>

changeSMSMessage() {
  this.smsMessage = this.smsMessage.substr(0, 10);
  console.log(this.smsMessage);
}

但是这不起作用。我看到该值在 changeSMSMessage() 方法中被剪切，但在 UI 上我看到值没有更改。
Plunker

当我将事件从 input 更改为 keyup 时，它开始正常工作。第十个字符之后的所有字符都将被删除。

那么，有人可以解释为什么 input 事件不更新 textarea 中的值吗？

Answer 1

您有多种选择:

1 - 使用文本区域的 maxlength="10" 标记:

<textarea [(ngModel)]="smsMessage" maxlength="10"></textarea>

2 - 使用 reactive form control与 built-in validator :

3 - 控制输入:

<textarea [(ngModel)]="smsMessage" (change)="changeSMSMessage()"></textarea>


// TS
changeSMSMessage() {
    this.smsMessage = this.smsMessage.length > 10 ? this.smsMessage.substr(0, 10), this.smsMessage;
}