如何导航/焦点到Angular2中的下一个项目？

我想使用箭头键聚焦到下一个项目。
在keydown事件处理程序中，我使用event.currentTarget.nextSibling来访问下一个项目。
还有另一种方法来实现这一目标吗？
在事件处理程序中，我想使用JQuery来执行此操作。 这该怎么做？

 
 
 
 
{{work.cd}}
 
{{work.name}}
 
 
  

 export class WorkComponent { ... handleKeyEvent(event: Event): void { event.currentTarget.nextSibling.focus(); event.preventDefault(); } } 

Answer 1

当输入值变为true时，创建一个焦点指令（并在NgModule注册），该指令在host元素上调用focus() ：

 @Directive({ selector : '[myFocus]' }) class MyFocus { constructor(public renderer: Renderer, public elementRef: ElementRef) {} @Input() set myFocus(value :boolean) { if(value) { this.renderer.invokeElementMethod( this.elementRef.nativeElement, 'focus', []); } } } 

添加选择器以及在指令聚焦时将true或false传递给指令的绑定：

更新关键事件的focusedIdx ：

  handleKeyEvent(event: Event): void { this.focusedIdx++; } 

另请参见Angular 2：关注新添加的输入元素