首页 文章

点击清晰后关闭下拉菜单

提问于
浏览 次
0

我可以选择下拉列表并获取数据，但后来的下拉列表没有关闭 .

下面是我的html代码：

<clr-dropdown [clrCloseMenuOnItemClick]="true" >
<button type="button" clrDropdownTrigger>
    <clr-icon shape="error" class="is-error" size="24"></clr-icon>
    <clr-icon shape="caret down"></clr-icon>
</button>
<clr-dropdown-menu *clrIfOpen> <label
    class="dropdown-header">Dropdown header</label>
<button type="button" class="dropdown-item "
    *ngFor="let module of moduleVal" (click)="selectModuleHandler($event)"
    value={{module}}>{{module}}</button>
</clr-dropdown-menu> </clr-dropdown>

我需要在工作结束后关闭下拉菜单，请帮助我 .

angular5 vmware-clarity

2 回答

  • 0

    您应该使用Angular组件作为下拉列表，然后单击要自动关闭的任何链接，将 clrDropdownItem 指令应用于菜单项 .

    https://vmware.github.io/clarity/documentation/v0.11/dropdowns#example

    回复于
  • 3

    Headers 上 About 菜单的一个简单示例：

    <div class="header-actions">
    <clr-dropdown>
        <button class="btn" clrDropdownTrigger>
            {{loggedOnUsername}}
            <clr-icon shape="caret down"></clr-icon>
        </button>
        <clr-dropdown-menu clrPosition="bottom-right" *clrIfOpen>
            <button type="button" (click)="openUserDialog = true" clrDropdownItem>Manage Users</button>
            <button type="button" (click)="openAboutDialog = true" clrDropdownItem>About</button>
            <button type="button" (click)="onLogout($event)" clrDropdownItem>Logout</button>
        </clr-dropdown-menu>
    </clr-dropdown>
</div>
    回复于

相关问题