APPmy/src/app/aichat/aichat.page.html

<ion-header [translucent]="true">
  <ion-toolbar>
    <ion-back-button slot="start" defaultHref="/tabs/tab3"></ion-back-button>
    <ion-title>AIChat</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-list lines="none">
    <ion-item *ngFor="let message of chatMessages">
      <ion-avatar slot="start">
        <ion-img [src]="message.senderAvatar"></ion-img>
      </ion-avatar>
      <ion-label>
        <h3>{{ message.sender }}</h3>
        <p>{{ message.content }}</p>
        <p class="message-time">{{ message.timestamp | date: 'medium' }}</p>
      </ion-label>
    </ion-item>
  </ion-list>

  <ion-item>
    <ion-input placeholder="请输入消息" [(ngModel)]="newMessage"></ion-input>
    <ion-button slot="end" (click)="sendMessage()">发送</ion-button>
  </ion-item>
</ion-content>