Angular 如何使我的下拉菜单在悬停而不是单击时工作？

我正在使用一个有角度引导的模板。当我用鼠标悬停在下拉列表上而不是单击它时，我试图调用下拉列表事件。我怎么称呼这个事件

<div ngbDropdown class="d-inline-block dropdown">
    <a class="navbar-brand" id="dropdownBasic1" href="#basiccomponents" ngbDropdownToggle>Learning</a>
        <div ngbDropdownMenu aria-labelledby="dropdownBasic1" class="dropdown-primary">
            <a class="dropdown-item">Learning Outcomes</a>
                <div class="dropdown-divider"></div>
                <a class="dropdown-item">Learning Plan</a>
        </div>
    </div>

学习成果
学习计划

尝试将棱角材质与mouseleave和mouseenter evenets搭配使用

参考文献：。 演示：

有一个

toggle（）

方法，以及显式

open（）

和

close（）

。通过绑定到

（mouseenter）

和

（mouseleave）

事件，在悬停时调用这些

下面是一些基础知识，这不是一个完整的示例。您需要提供对下拉列表的引用

...

onHover（事件）：无效{
this.myDropDown.toggle（）；
}

参考下拉列表后，当同一组件中有多个下拉列表时，它总是打开第一个元素下拉列表。但是我希望只在我正在做悬停的地方打开。有什么建议吗？使用

@ViewChild

为每个下拉元素提供一个命名引用，然后您可以使用单个方法切换这些引用，或者使用一个方法从

事件中获取元素引用名。target