美文网首页my ionic3我爱编程
ionic 实现动态高度的textarea

ionic 实现动态高度的textarea

作者: 种提莫的蘑菇 | 来源:发表于2018-03-05 15:11 被阅读16次

    1.首先是在HTML中要有对应的元素:

     <ion-textarea autosize></ion-textare>

    2.就是核心。ts的实现:

    //首先是导入

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

    创建监听  

    @HostListener('input', ['$event.target']) 

    onInput(textArea:HTMLTextAreaElement):void {

    this.adjust();

    }

    // ngOnInit():void {

    //  setTimeout(() => this.adjust(), 0);

    // }

    //是实现的核心代码

    adjust():void {

    const textArea =this.element.nativeElement.getElementsByTagName('textarea')[0];

      textArea.style.overflow ='hidden';

      textArea.style.height ='auto';

      textArea.style.height = textArea.scrollHeight +'px';

    }

    相关文章

      网友评论

        本文标题:ionic 实现动态高度的textarea

        本文链接:https://www.haomeiwen.com/subject/bsjhfftx.html