2015-01-12 22 views
9

Provo a fare in modo che il pulsante del menu non venga visualizzato quando viene visualizzato il pulsante Indietro. c'è un modo per permettere a Ionic di occuparsene? o tocca a me?Pulsante di navigazione nav ionico e pulsante di menu visualizzato insieme

ad esempio se utilizzo ui-sref per passare da app.users a app.users.add o app.users.details, mi aspetto che il pulsante del menu sia nascosto e che il pulsante back mostri, ma sono entrambi mostrando quando vado a viste nidificate. Esempio:

<button class="button button-positive" ui-sref="app.users.details({id:user.id})"> User details </button> 

app.js

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

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

    .state('app.users', { 
    url: '/users', 

    views: { 
     '[email protected]' : { 
     controller: 'UsersCtrl', 
     templateUrl: 'templates/users.html' 
     } 
    } 
    }) 

    .state('app.users.add', { 
    url: '/addUsers', 

    views: { 
     '[email protected]' : { 
     controller: 'AddUserCtrl', 
     templateUrl: 'templates/add_user.html' 
     } 
    } 
    }) 

    .state('app.users.details', { 
    url: '/userDetails/:id', 

    views: { 
     '[email protected]' : { 
     controller: 'UserDetailsCtrl', 
     templateUrl: 'templates/details_user.html' 
     } 
    } 
    }) 
} 

menu.html

<ion-side-menus> 
    <ion-pane ion-side-menu-content> 
    <ion-nav-bar class="bar-stable"> 
     <ion-nav-back-button class="button-clear"> 
     <i class="icon ion-ios7-arrow-forward"></i> back 
     </ion-nav-back-button> 
    </ion-nav-bar> 
    <ion-nav-view name="menuContent" animation="slide-right-left"></ion-nav-view> 
    </ion-pane> 

    <ion-side-menu side="right"> 
    <header class="bar bar-header bar-stable"> 
     <h1 class="title">Title</h1> 
    </header> 
    <ion-content class="has-header"> 
     <ion-list> 

     <ion-item nav-clear menu-close ui-sref="app.users"> 
      Users 
     </ion-item> 

     <ion-item nav-clear menu-close ui-sref="app.users.add"> 
      New user 
     </ion-item> 

     </ion-list> 
    </ion-content> 
    </ion-side-menu> 
</ion-side-menus> 

mio vista struttura è come tale:

<ion-view title="Title"> 

    <ion-nav-buttons side="right"> 
    <button menu-toggle="right"class="button button-icon icon ion-navicon"></button> 
    </ion-nav-buttons> 

    <ion-content class="has-header"> 
    ... 
     View Content 
    ... 
    </ion-content> 
</ion-view> 

risposta

4

'anche possibile ignorare che da una pagina figlio appena aggiungere la direttiva di ioni-side-menu all'interno del template figlio:

<ion-side-menus enable-menu-with-back-views="true"></ion-side-menus> 
<ion-view view-title="My Child page"> 
    <ion-content> 
     <h1>HEY</h1> 
    </ion-content> 
</ion-view> 

Questo aggiungerà la barra di navigazione completa (barra ion-nav) all'interno della pagina figlio che è stata aggiunta al modello menu.html (secondo l'esempio sopra)

1

Posiziona la barra di navigazione con il pulsante menu sulla pagina html in cui è necessario il pulsante menu e posiziona la barra di navigazione con il pulsante Indietro nella pagina in cui è necessario il pulsante Indietro.

come non ho bisogno di menu su home page in modo da inserire il vostro barra di navigazione sulla home page con pulsante di menu

<ion-view title="home"> 
    <ion-nav-bar class="bar-stable main-header-nav home-page"> 
    <ion-nav-buttons side="left"> 
     <button class="button button-icon button-clear ion-navicon" menu- toggle="left"></button> 
    </ion-nav-buttons> 
    </ion-nav-bar> 
    <ion-content></ion-content> 
</ion-view> 

e ho bisogno tasto posteriore a pagina Posta in arrivo in modo da utilizzare barra di navigazione con BackButton a pagina inbox

<ion-view title=""> 
    <ion-nav-bar class="bar-stable main-header-nav home-page"> 
    <ion-nav-back-button class="button-clear go-back"> 
     </ion-nav-back-button> 
    </ion-nav-bar> 
    <ion-content></ion-content> 
</ion-view> 
+0

ha funzionato per me. Grazie –

Problemi correlati