Question

是否可以使用组合框显示/加载不同的div？例如，我有两个包含不同表的Div，我想一次只显示一个表，我们可以从组合框中更改我们想要查看的表，然后单击加载按钮。这是片段

＆＃13;

<div align="center">
  <Select>
    <option value="survey101" name="survey101" id="survey101">Survey101</option>
    <option value="Survey102" name="survey102" id="survey102">Survey102</option>
  </Select>
  <button>LOAD</button>
</div>

<div>
  <ul *ngFor="let items of survey101">
  </ul>
</div>

<div>
  <ul *ngFor="let items of survey102">
  </ul>
</div>

＆＃13;

如果有可能，任何人都可以帮助/告诉我如何？谢谢。

Answer 1

试试这个：

<select [(ngModel)]="selectedSurvey">
    <option value="survey101">Survey101</option>
    <option value="survey102">Survey102</option>
</select>


<div *ngIf="selectedSurvey.survey101">
    <ul *ngFor="let items of survey101"></ul>
</div>

<div *ngIf="selectedSurvey.survey102">
    <ul *ngFor="let items of survey102"></ul>
</div>

您需要在组件的TS中添加名为selectedSurvey的变量。

private selectedSurvey: string = ""

Answer 2

您应为两个选择框设置 [(ngModel)] ，并根据 (ngModelChange) 获取所选值。

然后使用 *ngIf="selected ==="survey101" 嵌入table1

在 *ngIf="selected ==="survey102" 中嵌入了table2

Angular，使用组合框显示/加载不同的Div内容

2 个答案: