s202226701018/wisdom-app/src/app/poem-picture/poem-picture.component.html

<ion-header [translucent]="true">
  <ion-toolbar>
    <ion-title>
      示例：古诗文意境生成{{imagineWork.progress || 0}}
    </ion-title> 
  </ion-toolbar>
</ion-header>

<ion-content [fullscreen]="true">
  <!-- 生成提示词 -->
  <ion-textarea [value]="userPrompt" (ionInput)="promptInput($event)" placeholder="请输入古诗" autoGrow="true"></ion-textarea>
  <ion-button (click)="createImage()" expand="block">生成意境</ion-button>
  <!-- 意境画面提示词 -->
   <div>
    明月几时有，把酒问青天。不知天上宫阙，今夕是何年？
   </div>
  <div>
    {{PictureDescResult}}
  </div>
  <!-- 生成结果 -->
  @if(images.length) {
    @for(imageUrl of images;track imageUrl){
      <img [src]="imageUrl" alt="" srcset="">
    }
  }
  <!-- 生成状态 -->
  @if(!images.length){
    @if(imagineWork){
      <h1>生成中</h1>
    }
    @if(!imagineWork){
      <h1>未开始</h1>
    }
  }

</ion-content>