时间戳

首页 > 解决方案 > ResizeTextArea 角度为 5

angular - ResizeTextArea 角度为 5

问题描述

我是 Angular 的新手。我想让 textarea 自动调整大小，就像在这种情况下https://www.primefaces.org/primeng/#/inputtextarea一样。我尝试了不同的方法，但在 Angular 5 上没有任何效果。

这段代码显示了我最初版本的 textarea。

<div class="form-group" contenteditable="true">
    <label for="description">Description</label>
    <textarea type="text" class="form-control" id="description" [(ngModel)]="dish.description" #description="ngModel" name="description" required></textarea>
    <div [hidden]="description.valid || description.pristine" class="alert alert-danger">Description can't be empty</div>
</div>

我会感谢你的帮助，谢谢。

标签： angulartypescripttextareaangular5autoresize

解决方案

最后我得到了解决方案

  autogrow() { 
    let textArea = document.getElementById("description") 
    textArea.style.overflow = 'hidden'; 
    textArea.style.height = 'auto'; 
    textArea.style.height = textArea.scrollHeight + 'px'; 
}

在 HTML 中：

<textarea style="resize:vertical" (keyup)="autogrow()" rows="3" (click)="autogrow()" type="text" class="form-control" id="description" [(ngModel)]="myprivateObject.description" #description="ngModel" name="description" required></textarea>

推荐阅读