当某些事件发生时,我需要将焦点切换到输入元素。如何在角度2中做到这一点?
例如:
<input (keyUp)="processKeyUp($event)"/> <input (focusme)="alert('i am focused')"/>
当第一个按下某个键时,我想要聚焦第二个输入框。我想我需要使用自定义事件(在片段中的focusme),但是我不知道在哪里或如何声明它,以及是否为它使用@Directive注释,或者以某种方式将其定义包含在组件中。简而言之,我被困了。
UPDATE
忘了提到,我知道我可以通过在html中使用局部变量来做到这一点,但是我希望能够从组件中做到这一点,我想要在触发focusme事件时能够执行复杂的逻辑,以便控制监听它可以确定它是否适用于他们。
谢谢!
你可以这样做只是将第二个输入作为变量传递给第一个
例如
HTML
<!-- We pass focusable as a parameter to the processKeyUp function --> <input (keyup)="processKeyUp($event,focusable)"/> <!-- With #focusable we are creating a variable which references to the input --> <input #focusable />
后来你的js / ts
@Component({ selector: 'plunker-app' }) @View({ templateUrl: 'main.html' }) class PlunkerApp { constructor() { } processKeyUp(e,el) { if(e.keyCode == 65) { // press A el.focus(); } } }
el是原始元素,所以可以使用纯JavaScript。
这是一个plnkr,所以你可以看到它工作。
我希望它有帮助。