在Angular 7中,可以使用@HostListener
装饰器来监听单击和双击事件。以下是一个示例代码:
import { Component, HostListener } from '@angular/core';
@Component({
selector: 'app-example',
template: `
`
})
export class ExampleComponent {
@HostListener('click', ['$event'])
onSingleClick(event: MouseEvent) {
console.log('单击事件');
}
@HostListener('dblclick', ['$event'])
onDoubleClick(event: MouseEvent) {
console.log('双击事件');
}
}
click
和dblclick
事件绑定到对应的处理方法。注意:由于单击和双击事件都是基于鼠标事件的,因此需要传递$event
参数来获取鼠标事件对象。
以上示例中的代码会在单击和双击按钮时分别输出相应的事件信息到浏览器的控制台中。
希望对你有帮助!