代码之家 › 专栏 › 技术社区 › Learning is a mess

垫选择:让它选择第一个垫选项

angular-material drop-down-menu angular

Learning is a mess · 技术社区 · 7 年前

我有许多“角度材质选择”下拉列表,它们各自的材质选项会根据其他值以反应方式更新(换句话说,会对选项进行过滤)。它可以看起来像那样

<mat-select #selects (selectionChange)='formChanges()' [placeholder]='element.label' [disabled]='false' required>
  <ng-container *ngFor="let opt of item.options; index as index">
  <mat-option *ngIf="!videoService.filterStore[item.id] || videoService.filterStore[item.id].filter.includes(index)" [value]="opt">
    {{opt.label}}
  </mat-option>
</ng-container>
</mat-select>

1 回复 | 直到 7 年前

G. Tranter 7 年前

只要在列表更新时设置select的值即可。例如:

export class SelectExample {

  @ViewChild(MatSelect) select: MatSelect;

  updateSelectOptions() {
    // update the options
    ...

    // update the select value to the first item
    // might need to use a timeout to wait until the select has reloaded the options
    setTimeout(() => this.select.value = this.select.options[0].value);
  }
}

推荐文章

Yahya · 不能将我保存在props中的id用作reactselect中的默认值

1 年前

RSW · 使用plotly绘制多个pandas列,并使用下拉菜单选择列

2 年前

Jake Hembree · 多个下拉框

2 年前

MaÅ¥o Valapka · 下拉菜单会扭曲其他按钮

2 年前

Santi · Shadcn/ui选择-当用户选择项目时更改状态

2 年前

João Bosco · 使用python player从选择下拉列表中选择一个值

2 年前

Xeschoz · 为discord bot制作下拉菜单时出错

2 年前

Meghan M. · JS新手:NodeList返回null但有元素

2 年前

Hiyanneri · CSS-如何使用CSS增加下拉列表的宽度?

2 年前

T.Omalley · 数据验证源Excel中的嵌套函数

2 年前