ionic-framework - 离子标题标题越过按钮

Question

我已经实现了一个离子头：

<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-back-button id="test-back-button"
          [text]="'SITE_BUTTON_MAX30.BACK_BUTTON' | translate"
          icon="element-left-3"
      ></ion-back-button>
    </ion-buttons>

    <ion-title>
      {{ 'testtesttesttesttesttesttestesttest' }}
    </ion-title>

    <ion-buttons slot="end">  
      <ion-button (click)="router.navigate(['/home/dashboard-device', device.id, 'settings'])">
        <ion-icon class="icon" slot="icon-only" name="element-settings"></ion-icon>
      </ion-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

问题是当 ion-title 太长时，文本会越过左侧和右侧 图片的按钮，它是怎样的

但它不应该越过按钮。标题文字长这样就剪掉

我怎样才能做到这一点？