Fatal编程技术网
  • angular/
  • 显示/隐藏子元素的Angular2局部变量值

显示/隐藏子元素的Angular2局部变量值

angular

显示/隐藏子元素的Angular2局部变量值,angular,Angular,我试图在我的网站上复制一个简单的可折叠菜单导航栏，但我很难显示具有子元素的菜单项，因此它们是可折叠/可扩展的 我有一个简单的，每个都是一个导航元素。其中一些具有子，单击父时应展开子。这看起来真的是一个很好的菜单制作方法，但我无法让它工作 当前HTML： <nav class="widget-body"> <ul class="acc-menu"> <li class="nav-separator"><span>Explore<

我试图在我的网站上复制一个简单的可折叠菜单导航栏，但我很难显示具有子元素的菜单项，因此它们是可折叠/可扩展的

我有一个简单的
，每个
    • 都是一个导航元素。其中一些具有子
    ，单击父
    • 时应展开子
    。这看起来真的是一个很好的菜单制作方法，但我无法让它工作
    
当前HTML：
    

    <nav class="widget-body">
   <ul class="acc-menu">
      <li class="nav-separator"><span>Explore</span></li>
      <li class="hasChild" #configBtn (click)="configBtn.show"><a href="javascript:;"><i class="ti ti-settings"></i><span>Configuration</span></a>
          <ul class="acc-menu" [hidden]="configBtn.show">
              <li><a [routerLink]="['Configuration']">Gloabl settings</a>
          </ul>
      </li>
   </ul>
</nav>

    

    

      

    • 探索
      • 

    • 

        

      • 

          

        • Gloabl设置

        

    我想你需要
    

    [hidden]="configBtn.show ? true : null"

    
当
    configBtn.show
    更改为
    null
    但不在
    false
    上时，将
    hidden
    删除，这只会导致
    hidden=“false”
    
正如Sasxa已经提到的
    

    (click)="configBtn.show = !configBtn.show"

    

    我的答案只是一个猜测，因为你没有解释实际的问题是什么。请尝试
  • 成功：）谢谢