首页 > 解决方案 > 当我想要多个值时,角度复选框仅选择一个值数据

问题描述

大家好,我目前正在研究一个angular tickbox我想勾选多个值的项目。但是对于我来说,当我单击英语框时,它会显示有关英语的所有数据,但是当我勾选另一个复选框时,它只显示最新框的值德语而不是英语和德语一起。如何在主页图表上填充两个复选框数据。

TS代码

public onChangeLearnPrograms(event: any): void {
    if (event.source.selected) {
      this.homePageFilter.learn_Programs= event.source.value;
      this.generateCharts();
    }
  }

html代码

    <mat-form-field class="lg-filter-input-width">
      <mat-select placeholder = "learningprograms" formControlName="learn_Programs"multiple> 
        <mat-option type="checkbox" (onSelectionChange)="onChangeLearnPrograms($event)"
        *ngFor="let control of LearnPrograms | fieldFilter : 'learn_Programs' : filterFormGroup.value.learn_Programs" 
        [value]="control.learn_Programs" > {{control.learn_Programs}} </mat-option>
      </mat-select>
  </mat-form-field>
</form>
</mat-panel-description>

标签: htmlangulartypescript

解决方案


该复选框发出它已被选中但不知道任何其他选中的复选框。Therefore you currently overwrite the first value when a new checkbox is selected.

您应该是learn_Programs一个数组并在事件触发时删除/添加,onChangeLearnPrograms或者每当调用该函数时,遍历复选框以获取选中的复选框。


推荐阅读