角度2中的引导下拉“打开”事件答案

【问题标题】：bootstrap dropdown "open" event in angular 2角度2中的引导下拉“打开”事件
【发布时间】：2017-01-13 09:17:03
【问题描述】：

我正在尝试创建一个指令，该指令在单击时打开引导下拉菜单，并在鼠标离开时将其关闭。下拉指令代码：

import {Directive, HostBinding, HostListener} from '@angular/core';

@Directive({
  selector: '[rbDropdown]'
})
export class DropdownDirective {
  @HostBinding('class.open') get opened() {
    return this.isOpen;
  }
  @HostListener('click') open(){
    this.isOpen = true;
  }
  @HostListener('mouseleave') close(){
    this.isOpen = false;
  }

  private isOpen = false;

}

然后，在下拉 li 项中，我使用这个指令：

<li class="dropdown" rbdropdown>
  <a href="#" class="dropdown-toggle" role="button" aria-haspopup="true" aria-expanded="false">User <span class="caret"></span></a>
  <ul class="dropdown-menu">
    <li><a href="#">Login</a></li>
    <li><a href="#">Otg=her</a></li>
    <li role="separator" class="divider"></li>
    <li><a href="#">Logout</a></li>
  </ul>
</li>

但它不起作用......

【问题讨论】：

嘿。即使指令名称相同，我也会遇到同样的问题。

标签： twitter-bootstrap angular

【解决方案1】：

好吧，愚蠢的问题...IDE更改了li元素中的指令名称，我没有注意到它

【讨论】：