角度2设置默认滚动查看

时间:2018-11-29 15:57:16

标签: javascript angular typescript angular-material

在角度2垫选择中,我有50个项目(刚好是1到50的整数)。它的当前绑定值是5。在未打开状态下正确显示5。如果我打开选择/下拉菜单以更改该值,则希望下拉菜单滚动到项目26并突出显示它,因此用户只需单击即可。这是因为任何时候他们更改值的时间都是26的99%。任何有关如何执行操作的指示都值得赞赏。

1 个答案:

答案 0 :(得分:2)

您可以通过执行以下操作来完成此操作。

mat-select上设置模板引用

<mat-select #matSelect placeholder="List of numbers">

mat-form-field上使用click事件,并将matSelect作为参数传递

<mat-form-field (click)="focusItem(matSelect)">

将焦点设置为所需的选项索引

focusItem(el){
    el.options['_results'][25].focus()
  }

Stackblitz

https://stackblitz.com/edit/angular-tuh17s?embed=1&file=app/select-overview-example.html