Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG]Adding items to an existing list will cause MatSelect to scrollToTop = 0. #207

Closed
jvinhit opened this issue Feb 10, 2020 · 1 comment
Labels
bug Something isn't working duplicate This issue or pull request already exists

Comments

@jvinhit
Copy link

jvinhit commented Feb 10, 2020

Describe the bug

When update dataSource ( push new item to list ) mat-select scrollTop = 0;
When debugger check problem in here:

 /**
   * Scrolls the currently active option into the view if it is not yet visible.
   */
private adjustScrollTopToFitActiveOptionIntoView(): void {
    if (this.matSelect.panel && this.matSelect.options.length > 0) {
      const matOptionHeight = this.getMatOptionHeight();
      const activeOptionIndex = this.matSelect._keyManager.activeItemIndex || 0;
      const labelCount = _countGroupLabelsBeforeOption(activeOptionIndex, this.matSelect.options, this.matSelect.optionGroups);
      // If the component is in a MatOption, the activeItemIndex will be offset by one.
      const indexOfOptionToFitIntoView = (this.matOption ? -1 : 0) + labelCount + activeOptionIndex;
      const currentScrollTop = this.matSelect.panel.nativeElement.scrollTop;

      const searchInputHeight = this.innerSelectSearch.nativeElement.offsetHeight
      const amountOfVisibleOptions = Math.floor((SELECT_PANEL_MAX_HEIGHT - searchInputHeight) / matOptionHeight);

      const indexOfFirstVisibleOption = Math.round((currentScrollTop + searchInputHeight) / matOptionHeight) - 1;

      if (indexOfFirstVisibleOption >= indexOfOptionToFitIntoView) { ==>> bug indexOfOptionToFitIntoView = 0
        this.matSelect.panel.nativeElement.scrollTop = indexOfOptionToFitIntoView * matOptionHeight;
      } else if (indexOfFirstVisibleOption + amountOfVisibleOptions <= indexOfOptionToFitIntoView) {
        this.matSelect.panel.nativeElement.scrollTop = (indexOfOptionToFitIntoView + 1) * matOptionHeight - (SELECT_PANEL_MAX_HEIGHT - searchInputHeight);
      }
    }
  }

issue in conditional : if (indexOfFirstVisibleOption >= indexOfOptionToFitIntoView)
To Reproduce

Important Please provide a reproduction example. You can use https://stackblitz.com/github/bithost-gmbh/ngx-mat-select-search-example as a starting point

Expected behavior

Screenshots

Desktop (please complete the following information):

Smartphone (please complete the following information):

Additional context
Add any other context about the problem here.

@jvinhit jvinhit added the bug Something isn't working label Feb 10, 2020
@macjohnny
Copy link
Member

@jvinhit thanks for reporting this issue.
I think this is a duplicate of #200, so let's continue the discussion there and close this one.

@macjohnny macjohnny added the duplicate This issue or pull request already exists label Feb 10, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working duplicate This issue or pull request already exists
Projects
None yet
Development

No branches or pull requests

2 participants