diff --git a/core-libs/storefront/shared/components/list-navigation/sorting/sorting.component.html b/core-libs/storefront/shared/components/list-navigation/sorting/sorting.component.html index fa067de7eb0..58b986e2816 100644 --- a/core-libs/storefront/shared/components/list-navigation/sorting/sorting.component.html +++ b/core-libs/storefront/shared/components/list-navigation/sorting/sorting.component.html @@ -9,6 +9,7 @@ ariaLabel: ariaLabel || ('productList.sortResults' | cxTranslate), ariaControls: ariaControls, }" + #ngSelect > {{ sort.name ? sort.name : sortLabels && sort.code ? sortLabels[sort.code] : '' diff --git a/core-libs/storefront/shared/components/list-navigation/sorting/sorting.component.ts b/core-libs/storefront/shared/components/list-navigation/sorting/sorting.component.ts index 4dab532405a..87d2146469e 100644 --- a/core-libs/storefront/shared/components/list-navigation/sorting/sorting.component.ts +++ b/core-libs/storefront/shared/components/list-navigation/sorting/sorting.component.ts @@ -11,6 +11,7 @@ import { EventEmitter, Input, Output, + ViewChild, } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { NgOptionComponent, NgSelectComponent } from '@ng-select/ng-select'; @@ -31,6 +32,8 @@ import { NgSelectA11yDirective } from '../../ng-select-a11y/ng-select-a11y.direc ], }) export class SortingComponent { + @ViewChild('ngSelect') select: NgSelectComponent; + @Input() sortOptions: SortModel[] | undefined; @Input() @@ -53,6 +56,7 @@ export class SortingComponent { sortList(sortCode: string): void { this.sortListEvent.emit(sortCode); + requestAnimationFrame(() => this.select.focus()); } get selectedLabel() {