ClarityNg: как закрыть sidenav при нажатии кнопки внутри

У меня есть угловой шаблон базовой четкости с поиском в sidenav. Когда я нажимаю кнопку поиска в sidenav на мобильном устройстве, sidenav не исчезает. Как я могу закрыть sidenav с помощью angular?


person Sergey Slonimsky    schedule 19.09.2017    source источник
comment
Можете ли вы поделиться тем, как вы создали свой шаблон?   -  person Jeremy Wilken    schedule 19.09.2017
comment
Да, конечно ‹clr-main-container› ‹clr-header› ‹div class=branding› ‹/div› ‹div class=header-nav [clr-nav-level]=1› ‹/div› ‹/clr- header› ‹div class=content-container› ‹main class=content-area› ‹router-outlet›‹/router-outlet› ‹/main› ‹nav class=sidenav [clr-nav-level]=2› ‹app -боковая панель›‹/приложение-боковая панель› ‹/nav› ‹/div›   -  person Sergey Slonimsky    schedule 19.09.2017


Ответы (1)


Самым простым решением для вас было бы получить ссылку на экземпляр NavLevelDirective для sidenav с @ViewChild и всем его методом close().

Например, добавьте ссылочную переменную в свой шаблон:

<nav #mySidenav class="sidenav" [clr-nav-level]="2">
    <app-sidebar></app-sidebar>
</nav>

Затем получите доступ к нему в компоненте вашего приложения, используя:

@ViewChild("mySidenav", {read: NavLevelDirective}) sidenav: NavLevelDirective;

и просто вызовите sidenav.close(), когда пользователь нажмет кнопку "найти".

person Eudes    schedule 19.09.2017