SHARE
TWEET

Untitled

a guest Jan 22nd, 2019 60 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import { Directive, ElementRef, OnInit } from '@angular/core';
  2. import { Observable, fromEvent } from 'rxjs';
  3. import { DomController } from '@ionic/angular';
  4.  
  5.  
  6. @Directive({
  7.   selector: 'ion-textarea[autosize]'
  8. })
  9. export class TextareaAutosizeDirective implements OnInit {
  10.  
  11.   private inputObservable: Observable<any>;
  12.  
  13.   constructor(private el: ElementRef, private domCtrl: DomController) { }
  14.  
  15.   ngOnInit() {
  16.     const mutationObserver = new MutationObserver(() => {
  17.       this.el.nativeElement.style.height = `${this.el.nativeElement.lastChild.scrollHeight}px`;
  18.  
  19.       this.inputObservable = fromEvent(this.el.nativeElement.querySelector('textarea'), 'input');
  20.       this.inputObservable.subscribe((inputEvent: any) => {
  21.  
  22.         const textAreaNative = inputEvent.target;
  23.         this.domCtrl.write(() => {
  24.           this.el.nativeElement.style.height = 'auto';
  25.           textAreaNative.style.height = 'auto';
  26.           textAreaNative.style.height = `${textAreaNative.scrollHeight}px`;
  27.         });
  28.  
  29.       });
  30.     });
  31.     mutationObserver.observe(this.el.nativeElement, {
  32.         childList: true,
  33.     });
  34.   }
  35. }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!
 
Top