美文网首页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