Как в Angular 2 скрыть navbar-collapse при клике на пункте меню в мобильной версии?

Question

[beta-it]

Собственно в app.component.html вывожу меню (статически):

<nav *ngIf="authService.isLogged()" class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar"
                    aria-expanded="false" aria-controls="navbar">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" [routerLink]="['/']">
                <!--<img [src]="imgLOGO" class="img-responsive">-->
            </a>
        </div>
        <div id="navbar" class="collapse navbar-collapse">
            <ul class="nav navbar-nav navbar-right">

                <li>
                    <a routerLink="/account1" routerLinkActive="active">Пункт 1</a>
                </li>

                <li>
                    <a routerLink="/login" routerLinkActive="active">Выход</a>
                </li>

            </ul>
        </div><!--/.nav-collapse -->
    </div>
</nav>

И вопрос в том как скрыть в мобильной версии развернутое меню при клике на пункт?

Answer 1

[beta-it]

Пока использую этот код, после загрузки шаблона компонента:

ngAfterViewInit() {
        $('.navbar-collapse').on('click', 'a', function (e) {

            $('.navbar-collapse').collapse('hide');
        });
    }