app-myapp/src/app/tab-mine/tab-mine.page.html

<ion-content class="ion-padding">
  <ion-header>
    <ion-toolbar>
      <ion-title>我的</ion-title>
    </ion-toolbar>
  </ion-header>
  
  <ion-content color="light">
    <ion-card>
      <img alt="User Background" src="https://tse3-mm.cn.bing.net/th/id/OIP-C.ZSxe_CD8y2gVb9P_-mZVpAHaEG?w=305&h=180&c=7&r=0&o=5&dpr=1.3&pid=1.7" />
      <ion-card-header>
        <ion-card-title>{{ name || '尊贵的用户' }}</ion-card-title>
        <ion-card-subtitle>{{ userName || '未知' }}</ion-card-subtitle>
      </ion-card-header>
      <ion-card-content>
        {{ errorMessage }}
      </ion-card-content>
    </ion-card>
  
    <ion-list [inset]="true">
      <ion-button *ngIf="!isLoggedIn" expand="block" routerLink="../../user/login">登录</ion-button>
      <ion-button *ngIf="!isLoggedIn" expand="block" routerLink="../../user/register">注册</ion-button>
      <ion-button *ngIf="isLoggedIn" fill="clear" expand="block" (click)="logout()">登出</ion-button>
    </ion-list>
 
  

      <ion-list [inset]="true">
        <ion-item [button]="true" routerLink="/user/info">
          <ion-icon color="tertiary" slot="start" name="create-outline" size="large"></ion-icon>
          <ion-label>编辑资料</ion-label>
          <ion-note slot="end">丰富您的信息</ion-note>
        </ion-item>
       
      </ion-list>

     
    <ion-list [inset]="true" style="margin-bottom: 160px;">
      <ion-item [button]="true">
        <ion-icon color="danger" slot="start" name="book-outline" size="large"></ion-icon>
        <ion-label>我的课程</ion-label>
        <ion-note slot="end">6</ion-note>
      </ion-item>
      <ion-item [button]="true">
        <ion-icon color="tertiary" slot="start" name="star-outline" size="large"></ion-icon>
        <ion-label>我的收藏</ion-label>
        <ion-note slot="end">15</ion-note>
      </ion-item>
      <ion-item [button]="true">
        <ion-icon color="success" slot="start" name="eye-outline" size="large"></ion-icon>
        <ion-label>我的浏览</ion-label>
        <ion-note slot="end">3</ion-note>
      </ion-item>
    </ion-list>

  </ion-content>

  </ion-content>