1

我是角度新手,所以这可能是一个非常简单的问题。我正在使用 ngx-select-dropdown (下拉控件)。页面上有两个下拉控件,当第一个下拉列表更改时,第二个下拉列表应更新下拉选项。

新的下拉选项已通过 rest api 正确下载。我的问题是用户界面没有更新。当我在 ngOnInit 中添加下拉选项时,它可以工作。但是当我稍后添加它们时,它不起作用。

这会起作用:

  ngOnInit() {

    this.apiService.getAllActivities().subscribe(response => {
      this.activities = response;
      this.activityDropDownOptions = response;
    });
  }

这不是:

  activityDropDownSelectionChanged(event: any) {

    this.questionnaireDropDownOptions = []

    for (let activity of event.value) {
      this.apiService.getActivity(activity.id).subscribe(response => {

        for (let organisationalUnitQuestionnaire of response.organisationalUnitQuestionnaires) {
          this.questionnaireDropDownOptions.push(organisationalUnitQuestionnaire);
        }
      });
    }
  }

HTML页面:

   <form #searchForm="ngForm" id="searchForm" name="searchForm" (ngSubmit)="search()">

            <b>Aktion/ Projekt:</b>
            <div class="form-group">
              <label for="activityDropDown" class="mt-2">Aktion / Projekt:</label>
              <ngx-select-dropdown name="activityDropDown" id="activityDropDown" [multiple]="true" [(value)]="activityDropDownModel" [config]="activityDropDownConfig" [options]="activityDropDownOptions"
                                   (change)="activityDropDownSelectionChanged($event)"></ngx-select-dropdown>

              <label class="mt-2" for="visitPeriodInput">Besuchszeitraum Von / Bis:</label>
              <input name="visitPeriodInput" id="visitPeriodInput" type="text" autocomplete="off" placeholder="Keine Einschränkung ausgewählt" class="form-control"
                     bsDaterangepicker [bsConfig]="{ dateInputFormat: 'MM/DD/YYYY' }" [(ngModel)]="searchFormModel.visitPeriod">
            </div>

            <b>Fragebogen / Fragen</b>
            <div class="form-group">

              <label for="questionnaireDropDown" class="mt-2">Fragebogen:</label>
              <ngx-select-dropdown name="questionnaireDropDown" id="questionnaireDropDown" [multiple]="true" [(value)]="questionnaireDropDownModel" [config]="questionnaireDropDownConfig" [options]="questionnaireDropDownOptions"></ngx-select-dropdown>

              <label for="questionTextInput" class="mt-2">Fragetext beinhalt:</label>
              <input type="text" placeholder="Keine Einschränkung angegeben" class="form-control" name="questionTextInput" id="questionTextInput" [(ngModel)]="searchFormModel.questionText" autocomplete="off">

            </div>


          </form>
4

1 回答 1

2

你应该像下面这样写

this.questionnaireDropDownOptions = [...this.questionnaireDropDownOptions, organisationalUnitQuestionnaire];

而不是这个

this.questionnaireDropDownOptions.push(organisationalUnitQuestionnaire);
于 2019-04-17T07:15:38.643 回答