我有 3 个 HTML 文本框,每个文本框的初始宽度均为 30px。我想做到这一点,如果有人在其中一个文本框内键入超出文本框宽度的文本,则所有三个文本框的宽度都会扩展以匹配最大文本框的大小。执行此操作的最佳方法是什么?
最佳答案
@Component({
selector: 'my-app',
styles: [`#size
{
position: absolute;
visibility: hidden;
height: auto;
width: auto;
white-space: nowrap; /* Thanks to Herb Caudill comment */
}`]
template: `
<div id="size" #size>{{text}}</div>
<input #inp [(ngModel)]="text"
(ngModelChange)="width=size.clientWidth"
[style.width.px]="width > 50 ? width +10 : 60">
`,
})
它使用隐藏的 <div>
需要与输入元素相同的字体样式,每次更改时,输入都会更新以匹配隐藏的大小 <div>
包含相同的文本。
关于angular - 如何确保 angularjs 文本框适合文本中输入的内容?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40314031/