Ionic 2 - 如何僅刪除登錄頁面上的拆分面板？

Question

我在app.html中使用此代碼，拆分窗格工作得很好。但問題是，該窗格正在爲每個頁面（例如登錄或註冊）工作，所以請幫助我防止每個頁面的分割窗格工作。

<ion-split-pane when="(min-width: 768px)"> 
<ion-menu [content]="content"> 
    <ion-content id="Chat"> 
    </ion-content> 
</ion-menu> 
<ion-nav [root]="rootPage" #content></ion-nav> 
</ion-split-pane> 

Answer 1

基於什麼hoeksms提到here，你可以使用這樣的共享服務：

import { Injectable } from '@angular/core'; 
import { Platform } from 'ionic-angular'; 

@Injectable() 
export class SplitPaneData { 

    splitPaneState: boolean; 

    constructor(public platform: Platform) { 
     this.splitPaneState = false; 
    } 

    setSplitPane(state: boolean) { 
     if (this.platform.width() > 768) { 
      this.splitPaneState = state; 
     } else { 
      this.splitPaneState = false; 
     } 
    } 

    getSplitPane() { 
     return this.splitPaneState; 
    } 

} 

而在app.component使用該服務來顯示/隱藏：

<ion-split-pane [when]="splitPaneData.getSplitPane()"> 

如果要將其隱藏在給定頁面中，則可以使用ionViewWillEnter和ionViewWillLeave生命週期甚至TS：

ionViewWillEnter() { 
    // Disable the split plane in this page 
    this.splitPaneData.setSplitPane(false); 
} 

ionViewWillLeave() { 
    // Enable it again when leaving the page 
    this.splitPaneData.setSplitPane(true); 
} 

Answer 2

import { Component } from '@angular/core'; 
    import { MenuController,IonicPage, NavController } from 'ionic-angular'; 

    @IonicPage() 

    @Component({ 
     selector: 'page-signup', 
     templateUrl: 'signup.html', 
    }) 

    export class SignUp { 

    constructor(public navCtrl: NavController, public menu : MenuController) 
    { 
     this.menu.enable(false); 
     this.menu.swipeEnable(false); 
    } 

    ionViewWillLeave(){ 
    this.menu.enable(true); 
    this.menu.swipeEnable(true); 
    } 
    } 

希望這有助於。只需禁用菜單並用該分割面滑動菜單即可自動隱藏。