Question

我有像

这样的html结构

<div class="1"><input directive></div>
<div class="2"></div>
<div class="1"><input></div>
<div class="2"></div>

我想使用一个指令在同一个类的下一个元素上执行focus（）之类的操作。使用简单的nextElementSibling将无法正常工作。但是父元素的顺序是规则的，在这种情况下是交替的。

我可以使用

来实现它

this.elElRef.nativeElement.parentElement.nextElementSibling.nextElementSibling.firstElementChild

但这既不可靠也不优雅。有没有办法可以查询该元素的下一个搜索结果，例如输入？

谢谢！

Answer 1

由于可以任意查找其他输入，因此使用指令执行此操作并不是非常漂亮我建议使用#localVar和localVar.focus()的组合以下是您可以如何实施它的示例。

<div class="1"><input (keydown.enter)="input2.focus()"></div>
<div class="2"></div>
<div class="1"><input #input2 (keydown.enter)="input3.focus()"></div>

这里有一个stackbliz（类似于plunkr）的例子：https://stackblitz.com/edit/angular-vdg9a7g4f

angular directive elementRef - 查询匹配类的下一个元素

1 个答案: