<ion-header>
  <ion-toolbar color="primary">
    <ion-title>聊天</ion-title>
  </ion-toolbar>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-icon name="chatbubbles" slot="icon-only"></ion-icon>
    </ion-buttons>
    <ion-buttons slot="end">
      <ion-button>
        <ion-icon slot="icon-only" name="search"></ion-icon>
      </ion-button>
      <ion-button>
        <ion-icon slot="icon-only" name="person-add"></ion-icon>
      </ion-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-list>
    <ion-item *ngFor="let chat of chats">
      <ion-avatar slot="start">
        <img [src]="chat.avatar" />
      </ion-avatar>
      <ion-label>
        <h2>{{ chat.name }}</h2>
        <p>{{ chat.lastMessage }}</p>
      </ion-label>
    </ion-item>
  </ion-list>
</ion-content>
