方便的angular按钮绑定
如html
<input (keyup.enter)="keyUpSearch($event)" value="按下回车键触发"> <input (keyup.;)="keyUpSearch($event)" value="按下;号键触发">
官方文档:https://www.angular.cn/guide/user-input#key-event-filtering-with-keyenterapp
(keyup) 事件处理器监听每一次按键。 有时只在乎回车键,由于它标志着用户结束输入。 解决这个问题的一种方法是检查每一个 $event.keyCode,只有键值是回车键时才采起行动。ide
更简单的方法是:绑定到 Angular 的 keyup.enter 模拟事件。 而后,只有当用户敲回车键时,Angular 才会调用事件处理器。
示例:
template:ui
<input #box (keyup.enter)="update(box.value, $event)" (blur)="update(box.value)">
component:this
@Component({ selector: 'app-key-up4', }) export class KeyUpComponent_v4 { value = ''; update(value: string, event: any) { this.value = value; } }
经常使用的过滤有spa
(keyup.enter) // 按键并回车 (keyup.space) // 按键并空格 (keyup.control) // 按键并ctrl (keyup.shift) // 按键并shift (keyup.alt) // 按键并alt (keyup.1) // 按键1触发 (keyup.,) // 按键,触发 (keyup.3) // 按键并alt
不支持一些具备正则含义的符号,
如 / ? * 等code