如何在angular2中隐藏和显示sidenavbar

时间:2016-08-25 13:27:21

标签: angular typescript

我正在尝试以角度2显示和隐藏导航栏,但现在不能正常工作, 我的模板,

<nav class="navbar navbar-default navbar-fixed-top" role="navigation" style="margin-bottom:0px !important;">
  <div class="container">
    <div class="navbar-header">
      <a id="menu-toggle" (click)="show()" class="navbar-toggle">
          <span class="sr-only">Toggle navigation</span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
      </a>
      <a class="navbar-brand" href="home.xhtml">
        <img src="images/socialwiki.png">
      </a>
    </div>
    <div  *ngIf="hide" id="sidebar-wrapper"  class="sidebar-toggle">

      <ul class="sidebar-nav">
         <li>
              <a onclick="profilelink('login')"><i class="icon-signin"></i>login</a>
          </li>
          <li>
              <a onclick="profilelink('profile')"><i class="iconwidth icon-user"></i>Profile</a>
          </li>
          <li>
              <a onclick="profilelink('socialaddress')">Social Address<i class="icon-share"></i></a>
          </li>
          <li>
              <a onclick="profilelink('custominfo')"><i class="icon-info-sign"></i>Custom Info</a>
          </li>
          <li>
              <a onclick="profilelink('mysociety')"><i class="icon-users"></i>My Society(All)</a>

          </li>
          <li>
              <a onclick="profilelink('myprofile')"><i class="iconwidth icon-user"></i>My Profile</a>
        </ul>
    </div>

我的,

 export class Navbar {
hide:any = false;
show():any{
    alert("hi");
    this.hide = true;
}

我收到提醒信息但无法显示侧栏,有人可以建议帮助..................

0 个答案:

没有答案