有一个下拉菜单工作正常现在我想让这个代码可重用,或者创建指令,因为现在在更多页面中添加了更多下拉菜单
我更喜欢制定指令,但我真的被困在这里
<div class="nav-item has-dropdown">
<div class="menu-text" (click)="hasDropdown($event)">
Click me
</div>
<div class="has-dropdown-view">
Dropdown contenthere
</div>
</div>
hasDropdown(event){
let target = event.target || event.srcElement || event.currentTarget;
this.dropownView = !this.dropownView;
if( this.dropownView ){
target.closest('.has-dropdown').classList.add('has-open')
}else{
target.closest('.has-dropdown').classList.remove('has-open')
}
};
如何用指令“method”实现这个点击功能?
最佳答案
我认为这可以解决您的问题:
import { Directive,ElementRef, HostListener } from '@angular/core';
@Directive({
selector: '[hasDropdown]'
})
export class HasDropdownDirective {
constructor(private el: ElementRef) {
}
@HostListener('click') onMouseClick() {
//Place your code here
}
}
关于javascript - Angular 2 - 创建指令,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57143872/