时间戳

首页 > 解决方案 > 如何仅限制用户输入的长度，但允许以编程方式输入任何长度

html - 如何仅限制用户输入的长度，但允许以编程方式输入任何长度

问题描述

在这种情况下，输入字段被限制为 5 个字符供用户输入，一旦用户输入 5 个字符，我以编程方式附加一种输入描述（用户描述）。

由于实际输入将是用户输入，因此我希望将其限制为 5，但我应该能够以编程方式添加任意长度的字符串。当我当前执行此操作时，输入字段保持红色，就像打开了所需的标志一样。

标签： htmlangular

解决方案

我认为以下几点可能会有所帮助

  1. 您可以在（焦点）上添加一个空框和 maxLength 验证。和 on ( blur ) 删除验证并添加额外的文本。

或者

  1. 你可以通过 css Trick 做一个输入组框。（输入+ div）。（搜索输入组引导程序以获取更多信息）。在输入框中输入了 5 个包的验证，并使用您的附加逻辑进行焦点和模糊播放。
  • 第 1 点代码看起来像这样
 <input type="text"
           (focus)="firstName.maxLength = 5"
                    (blur)="appendString()"
     name="firstName" [(ngModel)]="model.firstName" #firstName="ngModel" required />

推荐阅读