Angular 如何在角度测验应用程序中显示选项1的说明？

我正在使用Angular开发一个测验应用程序，我需要在选择第一个选项时也显示解释文本（除了第一个选项外，所有选项的解释都会显示）。选择选项1后，即使没有任何解释，解释也会变回问题。同样对于问题1（多选），选择选项1时播放错误的声音，但答案是正确的

显示explanationText的di-quick.component.html中的代码片段：

<mat-card-content>
  <scoreboard></scoreboard>

  <section id="question" [class.answered]="answer">
    <span *ngIf="!answer">{{ question?.questionText }}&nbsp;
      <span *ngIf="numberOfCorrectOptions > 1">
        <em>({{ numberOfCorrectOptions }} options are correct)</em>
      </span>
    </span>
    <span *ngIf="answer">{{ explanationText }}</span>
  </section>

  <quiz-question
    [question]="question"
    (answer)="selectedAnswer($event)">
  </quiz-question>
</mat-card-content>

{{问题？.questionText}
（{{numberOfCorrectOptions}}选项正确）
{{explanationText}

请在此处查看我的StackBlitz:

---

我非常感谢你帮我修复这些错误。谢谢。

下一个问题不会出现，因为您没有重置

答案

属性，并且

*ngIf=“！answer”

始终为

真

转到下一个/上一个问题后，尝试重置它：

nextQuestion() {
  this.answer = null;
  this.checkIfAnsweredCorrectly();
  this.quizService.nextQuestion();
}

prevQuestion() {
  this.answer = null;
  this.quizService.prevQuestion();
}

---

如果您提供stackblitz示例的链接，我将不胜感激。请您对此问题提供帮助。谢谢。仅供参考，此问题已在感谢中得到回答。我添加了空赋值，问题重新设置。我希望无论何时选择任何选项，都会显示解释文本。似乎除了每个问题的第一个选项外，所有选项都会显示解释文本。