angular - 在Angular2 +中动态调整输入框大小的最佳方法是什么？

Question

我正在尝试使用不同的技术来动态调整 Angular2+ 中的输入框的大小。我尝试创建一个指令，这给我带来了一些麻烦，因为我仍然不完全理解指令是如何使用的，而且我认为我错误地实现了它。

[style.width.px]="myWidth"我发现我可以通过使用wheremyWidth是我可以在组件逻辑中计算的变量来接近我想要完成的任务。尽管这似乎是朝着正确方向迈出的一步，但理想情况下，我希望使用表达式而不是myWidth变量来调整任何需要超出其min-width在 CSS 中定义的输入的大小。

所以，我问是否有人可以引导我朝着正确的方向基本上说这样的话：

<input type="text" [style.width.px]="expression goes here">

其中表达式将获取输入框内容的当前长度，然后添加一些额外的像素用于填充。

感谢您提供任何帮助，如果您需要更多代码，我将很乐意提供。

标签： angular

Answer 1

嗯，不知道实现这一点的 Angular 方式，但您可以（当然）使用纯 javascript 来处理“更改”事件来计算输入字段中的字母，将其乘以 10 像素并更改动态的长度变量。然后 Angular 会自动重新渲染输入字段。