Angular MatSelect 和水平滚动问题

Question

正如您在 stackblitz 示例中所看到的，普通 html 选择在水平可滚动 div 中工作正常，但在

mat-select

（或材质菜单）中则不然。 要重现，请滚动到左侧并单击选择，这将在单击时滚动到右侧，因此您无法更改第一个选择的选定选项。

我已经打开了关于此问题的问题，但我没有得到答案。 所以我在这里问是否有人已经遇到过这个问题，或者你有什么想法来解决这个问题。

Answer 1

您有下面的代码，它设置了滚动左侧位置，这导致了这个奇怪的错误，因为它会在每次单击视图时触发。这不是角度材料选择的问题。

您可以将其设置为

ngAfterViewInit

，这似乎可以解决问题。

site-breadcrumb.component.ts

之前：

ngAfterViewChecked() {
  // this.breadcrumbContainer.nativeElement.scrollLeft =
  //   this.breadcrumbContainer.nativeElement.scrollWidth;
}

之后：

ngAfterViewInit() {
  this.breadcrumbContainer.nativeElement.scrollLeft =
    this.breadcrumbContainer.nativeElement.scrollWidth;
}

---

Stackblitz 演示

工作正常的示例代码