小编Mic*_*ake的帖子

我在 app-module.ts 上有以下配置

import { ReactiveFormsModule } from '@angular/forms';
import { DateFnsAdapter, MatDateFnsModule } from '@angular/material-date-fns-adapter';
import { DateAdapter, MatDateFormats, MatNativeDateModule, MAT_DATE_FORMATS, MAT_DATE_LOCALE } from '@angular/material/core';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { BrowserModule } from '@angular/platform-browser';
import { CommonModule } from "@angular/common";


let matLocale = "en-GB"
let dateInput = "DD/MM/YYYY";

export const MY_DATE_FORMATS: MatDateFormats = {
  parse: {
    dateInput: dateInput,
  },
  display: {
    dateInput: dateInput,
    monthYearLabel: 'MMM YYYY',
    dateA11yLabel: 'LL',
    monthYearA11yLabel: 'MMMM YYYY'
  },
};

@NgModule({
    declarations: [ …

我使用<cdk-virtual-scroll-viewport>固定项目大小进行虚拟滚动。

此外，我使用ActiveDescendantKeyManagerCDK A11y 提供的功能在视口内使用箭头键移动。

当我尝试同时使用它们时，出现以下问题：

由于虚拟滚动仅加载部分信息并在滚动（回收视图）时加载更多信息，因此ActiveDescendantKeyManager仅获取<cdk-virtual-scroll-viewport>. 当我加载更多时，索引会重复自己，因为虚拟滚动添加和删除项目，keyManager只是行为很奇怪，因为我希望索引按顺序排列（如果我有 5000 个项目，我希望索引按顺序排列，而不仅仅是从1-24，每次我滚动它们都会重复）。 这是 stackblitz 上的一个例子

我的问题是：有什么办法可以与他们一起工作吗？因为我想做的是用箭头键移动到以下滚动索引。