Angular 使用ionic 4时固定列宽不起作用

我使用的是角度/离子4。我正在尝试对齐标题和所有其他行。标题未与复选框对齐（已确认、已到达、已返回），每行复选框未对齐，标签未保留在单独的行上：

<ion-content>
  <ion-grid>
    <div *ngFor="let customer of customers; let i=index">
      <ion-row *ngIf="customer.admin==true">
        <ion-col>
          <ion-card>
            <ion-card-content text-center text-align: center>
              <b>Shift:</b>&nbsp;{{customer.eventtime}}
            </ion-card-content>
          </ion-card>
        </ion-col>
      </ion-row>
      <ion-row *ngIf="customer.admin==true">
        <ion-col col-9></ion-col>
        <ion-col col-1>Confirmed</ion-col>
        <ion-col col-1>Arrived</ion-col>
        <ion-col col-1>Returned</ion-col>
      </ion-row>
      <ion-row>
        <ion-col col-9>
          <ion-label *ngIf="customer.admin==true">{{customer.description}}&nbsp;-&nbsp;admin</ion-label>
          <ion-label>{{customer.name}}&nbsp;-&nbsp;{{customer.cellphone}}</ion-label>
        </ion-col>
        <ion-col col-1>
          <ion-checkbox></ion-checkbox>  
        </ion-col>
        <ion-col col-1>
          <ion-checkbox></ion-checkbox>
        </ion-col>
        <ion-col col-1>
          <ion-checkbox></ion-checkbox>
        </ion-col>
      </ion-row>
    </div>
  </ion-grid>
</ion-content>

移位：{{customer.eventtime}
证实
到了
返回
{{customer.description}}-admin
{{customer.name}-{{customer.mobile}

我搜索了有关设置要修复的列的帮助，但没有找到4个示例。

试试这段代码

 <ion-content>
  <ion-grid>
    <div *ngFor="let customer of customers; let i=index">
      <ion-row *ngIf="customer.admin==true">
        <ion-col>
          <ion-card>
            <ion-card-content text-center text-align: center>
              <b>Shift:</b>&nbsp;{{customer.eventtime}}
            </ion-card-content>
          </ion-card>
        </ion-col>
      </ion-row>
      <ion-row *ngIf="customer.admin==true">
        <ion-col size="9"></ion-col>
        <ion-col size="1">Confirmed</ion-col>
        <ion-col size="1">Arrived</ion-col>
        <ion-col size="1">Returned</ion-col>
      </ion-row>
      <ion-row>
        <ion-col size="9">
          <ion-label *ngIf="customer.admin==true">{{customer.description}}&nbsp;-&nbsp;admin</ion-label>
          <ion-label>{{customer.name}}&nbsp;-&nbsp;{{customer.cellphone}}</ion-label>
        </ion-col>
        <ion-col size="1">
          <ion-checkbox></ion-checkbox>  
        </ion-col>
        <ion-col size="1">
          <ion-checkbox></ion-checkbox>
        </ion-col>
        <ion-col size="1">
          <ion-checkbox></ion-checkbox>
        </ion-col>
      </ion-row>
    </div>
  </ion-grid>
</ion-content>

移位：{{customer.eventtime}
证实
到了
返回
{{customer.description}}-admin
{{customer.name}-{{customer.mobile}

Bhautik，你知道我为什么会有这个问题吗