Angular 如何水平居中离子滚动元素的一段

基本上我有一个离子卷轴，里面有一些按钮，它们比窗口本身占据更多的空间。 我想在你点击一个按钮后，让它在屏幕上水平居中。 使用下面的代码，它可以在Chrome上运行，但不能在移动设备（IOS）上运行，我不知道为什么

<ion-scroll scrollX="true" style="width: 100%; white-space: nowrap; height: 32px; margin: 10px 0 20px 0;">
    <ion-segment nowrap [(ngModel)]="subject" *ngIf="rankingsSubjects.length > 1" class="various-width-segments">
        <ion-segment-button *ngFor="let subject of subjects; let i = index" [id]="'subject_'+subject.value" [value]="subject.value" (click)="centerButton($event)">
            {{subject.text}}
        </ion-segment-button>
    </ion-segment>
</ion-scroll>

我也使用了这个：（加上许多其他格式）

在手机上似乎什么都不起作用，尽管在chrome上它可以完美地将手机置于中心位置。 我只在IOS上测试过，所以我不知道它在Android上是否有效。

COMPONENT.HTML

<ion-segment-button value="" (ionSelect)="segmentButtonClicked($event)">
  <ion-label>Heroes</ion-label>
</ion-segment-button>

<ion-segment-button value="Marvel Comics" (ionSelect)="segmentButtonClicked($event)">
  <ion-label>Marvel Comics</ion-label>
</ion-segment-button>

<ion-segment-button value="DC Comics" (ionSelect)="segmentButtonClicked($event)">
  <ion-label>DC Comics</ion-label>
</ion-segment-button>

<ion-segment-button value="DC Comics 1" (ionSelect)="segmentButtonClicked($event)">
  <ion-label>DC Comics1</ion-label>
</ion-segment-button>

<ion-segment-button value="DC Comics 1" (ionSelect)="segmentButtonClicked($event)">
  <ion-label>Marvel Comics1</ion-label>
</ion-segment-button>

---

请用为什么？它可以在浏览器上运行，但不能在应用程序本身上运行。。所以在这个网站上展示它，不会有任何好处

const el = document.getElementById(elementId);
el.scrollIntoView({inline: "center"});

<ion-segment-button value="" (ionSelect)="segmentButtonClicked($event)">
  <ion-label>Heroes</ion-label>
</ion-segment-button>

<ion-segment-button value="Marvel Comics" (ionSelect)="segmentButtonClicked($event)">
  <ion-label>Marvel Comics</ion-label>
</ion-segment-button>

<ion-segment-button value="DC Comics" (ionSelect)="segmentButtonClicked($event)">
  <ion-label>DC Comics</ion-label>
</ion-segment-button>

<ion-segment-button value="DC Comics 1" (ionSelect)="segmentButtonClicked($event)">
  <ion-label>DC Comics1</ion-label>
</ion-segment-button>

<ion-segment-button value="DC Comics 1" (ionSelect)="segmentButtonClicked($event)">
  <ion-label>Marvel Comics1</ion-label>
</ion-segment-button>