angular - Hur man tar bort <ion-footer> i Ionic 2

Jag försöker dölja om jag klickade på sökknappen, men det finns ett litet problem som jag inte kunde lösa.

till exempel detta är delen av min footer html-kod.

Not1: "search" är en normal variabel som definieras i den första .ts-koden med värdet "false".

Notera2: Om jag klickar på knappen finns det en funktion för att ändra den till "true".

<ion-footer *ngIf="!search">
  <ion-toolbar>
    <ion-input placeholder="Type some thing" [(ngModel)]="variables.chatText" (click)="autoScroll()"></ion-input>
    <ion-buttons end>
      <button ion-button icon-right color="royal" [disabled]="!variables.chatText" (click)="sendChat(variables.chatText)" >Send<ion-icon name="send"></ion-icon>
      </button>
    </ion-buttons>
  </ion-toolbar>
</ion-footer>

När jag vill dölja det, visas min sida som på den här bilden. Hur kan jag lösa detta problem?

Svar #1

Precis som du kan se i dokumentationen:

Om höjden på ion-header, ion-footer eller ion-tabbar ändras dynamiskt, måste content.resize() anropas för att uppdatera layouten för Content.

class YourPage {
  @ViewChild(Content) content: Content;
  search: boolean = false;

  toggleToolbar() {
    // Toggle the footer
    this.search = !this.search;

    // Update the size of the content
    this.content.resize();
  }
}