问题描述
-
如果我从键盘上按 Tab,那么
<div>
元素应该被聚焦并且(click)
事件应该工作 - 它目前工作正常 -
但是如果我用鼠标点击同一个
<div>
元素,那么这个<div>
元素不应该被聚焦并且(click)
事件应该起作用 - 这里<div>
element 只关注当前代码的第一次点击,不知道为什么?
html:
<button>First</button> <br/>
<div tabindex="0" (click)="func();" (keyup.enter)="func();" appDivfocusout>Check Focus Out on Click</div> <br/>
<button>Second</button>
component.ts:
import { Component } from '@angular/core';
@Component({
selector: 'my-app',templateUrl: './app.component.html',styleUrls: [ './app.component.css' ]
})
export class AppComponent {
name = 'Angular';
func(){
console.log("test message");
}
}
directive.ts:
import { Directive,ElementRef,Renderer2,HostListener } from '@angular/core';
@Directive({
selector: '[appDivfocusout]'
})
export class DivfocusoutDirective {
constructor(private el: ElementRef,private renderer: Renderer2) { }
@HostListener('click',['$event'])
onClick(e){
this.el.nativeElement.style.outline = 'none';
}
}
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)