Wyłącz menu bocznym za bezstykowa otworzyć gest strony logowania (lub dowolnej strony) w jońskich 2

Question

Jestem nowy na jońskich 2 & Angular2 i Pobrałem nowy szablon Ionic pomocą następującego polecenia

Ionic start appname sidemenu --v2 --ts 

Do tego konkretnego rozwiązania dodałem stronę logowania, aby zweryfikować użytkownika. Po pomyślnym sprawdzeniu użytkownik zostanie przekierowany na stronę menu, która korzysta z menu bocznego.

Ponieważ rozwiązanie jest oparte na szablonie sidemenu, menu boczne jest wyświetlane na stronie logowania, gdy użytkownik przesuwa się w lewo.

Ktoś może mi pomóc, aby naprawić ten błąd i wyłączyć wyświetlanie menu bocznego, gdy widok jest przesunięty.

Mój kod

App.ts złożyć

import {App, IonicApp, Platform,MenuController} from 'ionic-angular'; 
import {StatusBar} from 'ionic-native'; 
import {HelloIonicPage} from './pages/hello-ionic/hello-ionic'; 
import {ListPage} from './pages/list/list'; 
import {HomePage} from './pages/home/home'; 


@App({ 
    templateUrl: 'build/app.html', 
    config: {} // http://ionicframework.com/docs/v2/api/config/Config/ 
}) 
class MyApp { 
    // make HelloIonicPage the root (or first) page 
    rootPage: any = HomePage; 
    pages: Array<{title: string, component: any}>; 

    constructor(
    private app: IonicApp, 
    private platform: Platform, 
    private menu: MenuController 
) { 
    this.initializeApp(); 

    // set our app's pages 
    this.pages = [ 
     { title: 'Hello Ionic', component: HelloIonicPage }, 
     { title: 'My First List', component: ListPage } 
    ]; 
    } 

    initializeApp() { 
    this.platform.ready().then(() => { 
     // Okay, so the platform is ready and our plugins are available. 
     // Here you can do any higher level native things you might need. 
     StatusBar.styleDefault(); 
    }); 
    } 

    openPage(page) { 
    // close the menu when clicking a link from the menu 
    this.menu.close(); 
    // navigate to the new page if it is not the current page 
    let nav = this.app.getComponent('nav'); 
    nav.setRoot(page.component); 
    } 
} 

app.html plikowi

<ion-menu side-menu-content drag-content="false" [content]="content"> 

    <ion-toolbar> 
    <ion-title>Pages</ion-title> 
    </ion-toolbar> 

    <ion-content> 
    <ion-list> 
     <button ion-item *ngFor="#p of pages" (click)="openPage(p)"> 
     {{p.title}} 
     </button> 
    </ion-list> 
    </ion-content> 

</ion-menu> 

<ion-nav id="nav" [root]="rootPage" #content swipe-back-enabled="false"></ion-nav> 

Homepage.ts plików (strona logowania w tym przypadku).

import {Page, Events,Alert,NavController,Loading,Toast,Storage,LocalStorage,SqlStorage} from 'ionic-angular'; 
import { FORM_DIRECTIVES, FormBuilder, ControlGroup, Validators, AbstractControl } from 'angular2/common'; 
import {HelloIonicPage} from '../hello-ionic/hello-ionic'; 
import {NgZone} from 'angular2/core'; 

@Page({ 
    templateUrl: 'build/pages/home/home.html' 
}) 
export class HomePage { 

public Uname :string; 
public usrvalid:boolean; 
public usrpwd :boolean; 
public usrpwdlength:boolean; 
public usrvalidlength:boolean; 
public isUnchanged:boolean; 
public usrpwdzero:boolean; 
public usrvaliddigits:boolean; 
rootpage:any; 

public Upwd:string; 
    constructor(public nav:NavController) { 
this.nav=nav; 
this.isUnchanged=true; 
var mediumRegex = new RegExp("^(((?=.*[a-z])(?=.*[A-Z]))|((?=.*[a-z])(?=.*[0-9]))|((?=.*[A-Z])(?=.*[0-9])))(?=.{6,})"); 

// rootPage: any = HomePage; 

    } 
} 

Answer 1

myślę dyrektywa drag-content jest stosowany w jonowym 1, dla Ionic 2, co można zrobić, to wyłączyć go od wewnątrz pliku klasy strona.

Można to zrobić poprzez importowanie dostawcę z ionic-angularMenuController a następnie wywołać metodę .swipeEnable(shouldEnableBoolean, menuId) wyłączyć gest machnięcia w klasie Twojej strony (jest to również udokumentowane here).

Kontroler logowania powinno być coś takiego ...

import {Page, MenuController} from 'ionic-angular'; 

@Page({ 
    templateUrl: 'build/pages/home/home.html' 
}) 
export class HomePage { 
    constructor(public menu: MenuController) { 
     this.menu.swipeEnable(false); 
    } 
} 

Jeśli masz wiele menu i każdy z nich ma identyfikator następnie można kierować konkretnego menu jak to ...

this.menu.swipeEnable(false, `menuId`); 

Answer 2

można włączyć/wyłączyć w dowolnym momencie sidemenu na dowolnej stronie nazywając

$ ionicSideMenuDelegate.canDragContent (false)

np.

angular.module ('ABC') sterownik ('xyzCtrl', funkcja (zakres $, $ ionicSideMenuDelegate) {

$ionicSideMenuDelegate.canDragContent(false) 

});