在离子中自动生长textarea [英] Auto growing textarea in ionic

问题描述

我正在尝试向我的应用添加一个自动增长的textarea但由于某种原因它无法正常工作。我正在使用的模块是 https://github.com/tagged/autogrow （有人建议使用离子论坛）

I am trying to add an autogrowing textarea to my app but for some reason it is not working. The module that I am using is https://github.com/tagged/autogrow (it was recommneded on the ionic forum)

推荐答案

我写了一个非常简单的指令，适用于Ionic 2和 ion-textarea 。这是：

I wrote a very simple directive that works with Ionic 2 and ion-textarea. Here it is:

import { Directive, HostListener, ElementRef } from "@angular/core";

@Directive({
selector: "ion-textarea[autoresize]" // Attribute selector
})
export class Autoresize {
  @HostListener("input", ["$event.target"])
  onInput(textArea: HTMLTextAreaElement): void {
    this.adjust();
  }

  constructor(public element: ElementRef) {
  }

  ngOnInit(): void {
    this.adjust();
  }

  adjust(): void {
    let ta = this.element.nativeElement.querySelector("textarea");
    ta.style.overflow = "hidden";
    ta.style.height = "auto";
    ta.style.height = ta.scrollHeight + "px";
  }
}

这是一个要点： https://gist.github.com/maxt3r/2485356e91a1969bdb6cf54902e61165

这篇关于在离子中自动生长textarea的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！