在Angular中，如何根据先前的选择来操纵选项标签中的显示？

Question

我有两个选择框。一个用于会话，一个用于报告文件名。

Interface.ts：

export interface ExceptionReportSessionData {
  SessionName: string,
  ReportFiles: Array<string>
}

HTML：

<div class="input-group">
    <h4>Session: </h4>
    <select class="custom-select form-control-sm" id="inputGroupSelect01">
      <option value="Select Session">Select session...</option>
      <option *ngFor="let session of sessionData">{{session.sessionName}}</option>
    </select>
  </div>
  <div class="input-group">
    <h4>Report Date: </h4>
    <select class="custom-select form-control-sm" id="inputGroupSelect01">
      <option value="">Select report date...</option>
      <option *ngFor="let report of sessionData">{{report.reportFiles}}</option>
    </select>
  </div>

我的服务检索ExceptionReportSessionData接口的列表。一个会话可以具有多个或没有与之关联的ReportFiles。我无法弄清楚该怎么做，如果用户从第一个下拉框中选择一个会话，我只希望他们在第二个下拉框中看到与该会话相关联的ReportFiles。

Answer 1

一种简单的方法是在会话选择上发生sessionData事件时更新报告选择的selectionChange。您有几种方法可以这样做，我会为您推荐一个简单的方法，