跳转页面时Ngx-Chart跳过焦点

Question

我有一个图表 (ngx-charts-pie-chart)，当我在页面上使用选项卡时，它会获得焦点。我想从我的页面的自然标签中完全排除这个组件。我尝试了很多东西，包括惰性。有没有人有任何建议从我的标签中排除这个？

请参阅下面的堆栈闪电战。

Taborder1 按钮 -> 点击标签应该转到 taborder2 按钮。

https://stackblitz.com/edit/angular-5vyr3d

Answer 1

@Directive({
 selector: '[sksInert]'
})
export class InertDirective implements AfterViewInit {
@Input() public excludeElementsInTabOrder: string[] = [];

constructor(private elementRef: ElementRef) { }

ngAfterViewInit(): void {
    for (const elementName of this.excludeElementsInTabOrder) {
        const elements = this.elementRef.nativeElement.getElementsByTagName(elementName);

        for (const gElement of elements) {
            gElement.setAttribute('tabindex', -1);
        }
    }
}
}

用指令解决了这个问题，并在图表的父元素上使用了指令。