ng-show不适用于Ionic框架

时间:2016-01-02 18:34:36

标签: javascript angularjs ionic-framework ng-show

所以我只是想根据用户是否登录来创建一个按钮。 继承人我想要的东西:

    <ion-view view-title="Settings">
       <ion-nav-buttons side="right">
 <a href="#/camera"><img src="../img/camera.png" height="20%" width="20%" style="float:right; margin-right: 10px"></a>
       </ion-nav-buttons>
       <ion-nav-buttons side="left">
   <button ng-show="isLoggedOn" class="button button-full button-assertive" style = "margin-top: 0px;" ng-click = "signOff()">
     Log Off
   </button>
       </ion-nav-buttons>
       <ion-nav-buttons side="left">
   <button ng-show="!isLoggedOn" class="button button-full button-assertive" style = "margin-top: 0px;" ng-click = "signOn()">
     Log On
   </button>
       </ion-nav-buttons>

出于某种原因,如果我没有登录,它只会显示第二个按钮(登录按钮),如果我已登录,则根本不显示任何内容。 我甚至直接将ng-show设置为登录为false并注销为true,它仍然给了我相同的结果:

  <ion-view view-title="Settings">
       <ion-nav-buttons side="right">
 <a href="#/camera"><img src="../img/camera.png" height="20%" width="20%" style="float:right; margin-right: 10px"></a>
       </ion-nav-buttons>
       <ion-nav-buttons side="left">
  <button ng-show="true" class="button button-full button-assertive" style = "margin-top: 0px;" ng-click = "signOff()">
     Log Off
   </button>
       </ion-nav-buttons>
       <ion-nav-buttons side="left">
   <button ng-show="false" class="button button-full button-assertive" style = "margin-top: 0px;" ng-click = "signOn()">
     Log On
   </button>
       </ion-nav-buttons>

将登录按钮的ng-show值切换为true,将注销按钮切换为false显示登录按钮。没有意义......继承我的JS代码:

     .controller("settingsController", function($scope, $cordovaSQLite, Settings, $location) {
       $scope.isLoggedOn = Settings.getLoggedOn();
       $scope.signIn = function(form) {
 console.log(Settings.logIn(form.email, form.password));
 console.log($scope.isLoggedOn);
 $scope.isLoggedOn = Settings.getLoggedOn();
       //  console.log($scope.isLoggedOn);

       };
       $scope.signOff = function() {
 Settings.logOff();
       };
     });

请注意,这些是代码段,因此您可能找不到所有结束标记。基本上我的问题是无论我做什么,无论是登录还是注销按钮,无论我做什么,注销按钮(第一个按钮)都不会显示。我试过 - 如果太过产生相同的结果了。

感谢。

1 个答案:

答案 0 :(得分:1)

好吧,看起来...... <ion-nav-buttons side="left">覆盖了另一个..!

试试这个:

<ion-nav-buttons side="left" >
      <button ng-show="isLoggedOn" class="button button-full button-assertive" style = "margin-top: 0px;" ng-click = "signOn()">
        Log On
      </button>
      <button ng-show="!isLoggedOn" class="button button-full button-assertive" style = "margin-top: 0px;" ng-click = "signOff()">
        Log Off
      </button>
</ion-nav-buttons>