Angular 2不工作与* ngFor的折叠功能

Question

我正在尝试在侧边栏菜单中添加项目。 当我删除课程时，折叠功能正常工作（显示子项目）＆＃34; .collapse＆＃34;从subitems，但我需要使用collapse函数，当然我从JSON获取菜单数据。

Sidebar.html

<ul class="sidebar-nav">
<li *ngFor="let item of menu">
  <a class="collapsed" data-target="#sidebar-dashboard" data-toggle="collapse" data-parent="#sidebar">
    <span class="icon">
        <i class="fa fa-desktop"></i>
      </span>
    {{ item.name }} 
     <i class="toggle fa fa-angle-down"></i>  
  </a>
  <ul id="sidebar-dashboard" class="collapse">
    <li *ngFor="let subitem of item.submenu">
      <a>{{ subitem.name }}</a>
      </li>
     </ul>
   </li>
 </ul>

Plunker链接： https://plnkr.co/edit/0dq0NiiTtYQwK5jRUQhG?p=preview

为什么当我把ngFor放入＆＃34; li＆＃34;当我用文本替换ngFor时，崩溃函数可以正常工作吗？

我怎么解决？ 任何单一的帮助将不胜感激。 谢谢！