AngularJS ng-show - 2次,2种不同的结果

时间:2016-11-25 08:42:35

标签: angularjs ng-show

我正在使用angularjs,cordova和iconic创建一个应用程序。 我有一个垃圾图标,只有当用户在主页面时才应显示。

所以我只会在rootScope.Trashicon上显示图标。

它在我的侧面菜单中运行良好。但是在侧边菜单内容区域它不起作用。我不知道为什么......

    <ion-side-menus ng-controller="MainController" ng-init="getListTitle()">
      <ion-side-menu side = "left"> <!-- expose-aside-when DELETE IT !!!!!! -->
          <header><img src="img/todo_today_logo_small.png"></header>
          <div id="sideContent" class="item item-divider">ToDo Liste: 
              <p>                  
                  > <a menu-close href="#/todo">{{sideMenuListTitle}}</a>
              </p>
              <div ng-show="Trashicon">test</div>
              <h3></h3>
          </div>
          <div>
              <ul>
                  <li><a menu-close href="#/impressum">Impressum</a></li>
                  <li><a menu-close href="#/datenschutzerklaerung">Datenschutzerklärung</a></li>
              </ul>
          </div>
      </ion-side-menu>

      <ion-side-menu-content>
           <ion-nav-bar class="custom-dark" align-title="center">
               <ion-nav-buttons side="left">


    <!-- Toggle left side menu -->
   <button menu-toggle="left" class="button button-icon icon ion-navicon light"></button>   
  </ion-nav-buttons>
               <div ng-show="Trashicon">
                   <ion-nav-buttons side="right">
                   <button ng-click="deleteProducts()" class="button button-icon ion-ios-trash-outline pull-right light"></button>
               </ion-nav-buttons> 
               </div>                 
         <ion-nav-title></ion-nav-title>
  </ion-nav-bar>
          <div ng-view="" class="container"></div>
      </ion-side-menu-content>
  </ion-side-menus>

这是我的rootScope变量

.controller('MainController', function ($scope, $ionicPopup, $rootScope) {
            $rootScope.Trashicon = false;

带有垃圾图标的div仍然可见..我不知道为什么......如果有人对我这么想会很棒。

2 个答案:

答案 0 :(得分:1)

它接缝元素离子导航按钮有自己的样式,它会覆盖它上面的所有元素。

如果您将 ng-show 移近按钮,您可以更好地控制。

,而不是

<div ng-show="Trashicon">
    <ion-nav-buttons side="right">
        <button ng-click="deleteProducts()" class="button button-icon ion-ios-trash-outline pull-right light"></button>
    </ion-nav-buttons> 
</div>   

这样做

<div>
    <ion-nav-buttons side="right">
        <button ng-show="Trashicon" ng-click="deleteProducts()" class="button button-icon ion-ios-trash-outline pull-right light"></button>
    </ion-nav-buttons> 
</div>

答案 1 :(得分:0)

如果我尝试ng-show =“1 == 2”,它也只能在侧面菜单中使用....

而不是在侧边菜单内容区域.. div将显示ng-show =“1 == 2”...奇怪