[Angularjs] 離子 - 如何刪除登錄頁面上的sidemenu只?


Answers

這裡同樣的問題。 只需在離子視圖中添加hide-nav-bar =“true”即可

<ion-view hide-nav-bar="true">

希望能幫助到你!

Question

我只需要在我的登錄頁面上刪除sidemenu。 否則保持。 如何做到這一點? 我正在使用命令離子ionic start myApp sidemenu來創建項目。

app.js

.config(function($stateProvider, $urlRouterProvider) {
  $stateProvider

    .state('login', {
      url: "/login",
      templateUrl: "templates/login.html",
      controller: 'LoginCtrl'
    })

    .state('app', {
      url: "/app",
      abstract: true,
      templateUrl: "templates/menu.html",
      controller: 'AppCtrl'
    })

    .state('app.search', {
      url: "/search",
      views: {
        'menuContent' :{
          templateUrl: "templates/search.html"
        }
      }
    })

登錄頁面

<ion-view title="Login">
  <ion-content>
      <div class="list">
        <label class="item">
          <button class="button button-block button-positive" type="submit" ng-click="login()">Log in</button>
        </label>
      </div>

  </ion-content>
</div>



有點遲到遊戲,但這是另一種選擇(如我)誰需要保持他們的登錄視圖內的side-menu佈局,但需要隱藏的側面菜單按鈕,同時保持觀看標題。

login.html視圖中,使用ion-header-bar指令創建一個帶有標題的新標題,然後通過ion-view標籤隱藏side-menu佈局中的ion-nav-bar

示例(login.html)

<ion-header-bar class="bar-positive" align-title="center">
    <h1 class="title">Login</h1>
</ion-header-bar>

<ion-view hide-nav-bar="true">
 <!-- Login content goes here -->
</ion-view>

然後,如果您需要禁用任何拖動手勢,請在控制器中像@waqas所示。




  <ion-pane ion-side-menu-content drag-content="false">
       <ion-header-bar class="bar-dark">
           <h1 class="title">Cards</h1>
       </ion-header-bar>
       <ion-content scroll="true">
       </ion-content>
   </ion-pane> 

這是我的作品...




您也可以將其添加到您的主要應用程序控制器:

$scope.$root.enableLeft = true;
$scope.$root.showMenuIcon = true;

並且在每個你不希望你的側面菜單出現的控制器中簡單地把它切換為false:

$scope.$root.enableLeft = false;
$scope.$root.showMenuIcon = false;

在html標籤中添加is-enabled =“$ root.enableLeft”到你的html標籤和ng-show =“$ root.showMenuIcon”。




離子2

import { MenuController } from 'ionic-angular';

export class LoginPage {

   constructor(public menuCtrl: MenuController) {

   }

   ionViewWillEnter() {

       this.menuCtrl.swipeEnable( false )
   }

   ionViewDidLeave() {

       this.menuCtrl.swipeEnable( true )
   }
}



<ion-side-menus>

BCN

            <ion-tab title="ALL" href="#/dashbord/all" class="bgorange">
                <ion-nav-view name="all"></ion-nav-view>
            </ion-tab>


            <ion-tab title="INFO" class="bgorange" href="#/dashbord/info">
                <ion-nav-view name="info"></ion-nav-view>
            </ion-tab>

            <ion-tab title="EVENTS" class="bgorange" href="#/dashbord/events">
                <ion-nav-view name="events"></ion-nav-view>
            </ion-tab>


        </ion-tabs>
        <ion-nav-view></ion-nav-view>

    </ion-pane>
    <div ng-include src="calender.html"></div>
    <ion-side-menu side="left">

        <ion-content has-header="true">
            <ion-list>

                <ion-item menu-close class="item-icon-left bottombordernone" href="#/dashbord">
                    <i class="icon ion-home"></i>
                    What's New
                </ion-item>
                <ion-item menu-close class="item-icon-left bottombordernone">
                    <i class="icon ion-chatbox-working"></i>
                    Feedback
                </ion-item>
                <ion-item menu-close class="item-icon-left bottombordernone" ng-click="logout()">
                    <i class="icon ion-power"></i>
                    Logout
                </ion-item>
            </ion-list>
        </ion-content>
    </ion-side-menu>

@Zulu這裡是我的完整代碼。 我希望這個前。 為你工作。




你必須看滑動菜單。 如果打開,則必須將其切換並關閉。

 .controller('kayTOlCtrl', function($scope,$ionicSideMenuDelegate) {
     //
     $scope.$watch(function () {
            return $ionicSideMenuDelegate.getOpenRatio();
        },

                    function (ratio) {
                        if (ratio != 0) {
                          $ionicSideMenuDelegate.toggleRight();

                        }

                    });
    })



.state('login', {
        url: '/login',
        controller: 'LoginCtrl',
        templateUrl: 'templates/loginpage.html'
    })
.state('app.account', {
        url: '/account',
        views: {
            'menuContent': {
                templateUrl: 'templates/account.html',
                controller: 'AccountCtrl'
            }
        }
    })