Ionic-angular ion-textarea's height shrink

Issue

I'm coding with ionic-angular framework for some project. When I use ion-textarea, sometimes the textarea's height is decreased 0px. If the textarea code like that,

<ion-textarea class="translated"
  [value]="text">
</ion-textarea>

• nomal state

• shrink state

In shrink state case, the height of ion-textarea is normal but the div and textarea in the ion-textarea get somemthing wrong.

I want to know what is the cause of this situation and how to solve!!

please let me know what is the problem (I tested it in chrome browser)

Solution

bad but works:

@ViewChild(IonTextarea, {static: false}) ionTextarea: IonTextarea;

async ngAfterViewInit(): Promise<void> {
  await this.checkTextarea();
}

async checkTextarea() {
 return this.ionTextarea.getInputElement().then((element) => {
  if (element.style.height == '0px') {
    return element.style.height = 'auto';
  } else {
    setTimeout(() => this.checkTextarea(), 100)
  }
  
 })
}

Answered By - nvvetal