Angular 角度4引导导航栏不使用动态绑定

我使用的是Angular 4和Bootstrap 3.3。使用静态数据，左侧导航栏工作正常。但当我从DB中获取菜单项并尝试使用*ngFor时，Navbar正在加载，但collapse不起作用

代码段：

<div id="sidebar-wrapper" >
    <nav id="spy">
        <ul class="sidebar-nav nav" id="side-menu" >
            <li >
                <a href="#"> Survey<span class="fa arrow"></span></a>
                <ul class="nav nav-second-level">
                    <li>
                        <a href="#">Event Details</a>
                    </li>
                    <li>
                        <a href="#">Event History</a>
                    </li>
                    <li>
                        <a href="#">Event Summary</a>
                    </li>
                    <li>
                        <a href="#">Notes</a>
                    </li>
                    <li>
                        <a href="#">Back Out</a>
                    </li>
                    <li>
                        <a href="#">Print Form</a>
                    </li>

                </ul>
            </li>
            <li *ngFor="let menu of navmenuData">
                <a class="nav-link"
        [routerLink]=""> {{ menu.MenuName }} <span class="fa arrow"></span></a>
                <ul *ngIf="menu?.children?.length>0"  [ngClass]="{'nav nav-second-level collapse':menu.children.length>0}">
                    <li  *ngFor="let submenu of menu?.children">
                        <a class="nav-link"
        [routerLink]="">{{ submenu.MenuName }}</a>
                    </li>
                </ul>
            </li>
        </ul>
    </nav>
</div>

{{menu.MenuName}


{{submenu.MenuName}}

任何控制台错误？单击展开是否会更改menu.children的值？