sembilanlangit
sembilanlangit

Reputation: 355

NavigatorView's page stack is empty back to main page Onsen UI

hallo i am new with Onsen UI Framework. Very nice framework and beautiful. But i have problem with navigation. From main page to another template, in this template i type some data and save it, then automacally back again to main page. I am using myNavigator.popPage(). i have error NavigatorView's page stack is empty. here my code i am using sliding menu

Index.html

    <ons-navigator title="Navigator" var="myNavigator">
          <ons-sliding-menu close-on-tap
                          main-page="main.html"
                          menu-page="menu.html"       
                          side="left"
                          max-slide-distance="250px"
                          var="menu">
        </ons-sliding-menu>
  </ons-navigator>


 <ons-template id="menu.html">      
  <ons-list>
    <ons-list-item modifier="chevron" onclick="menu.setMainPage('nomor.html', {closeMenu: true})">
      Setting Nomor
    </ons-list-item>
  </ons-list>
</ons-template>


<ons-template id="nomor.html">
    <ons-page ng-controller="penomoranController">
    <ons-toolbar>
      <div class="left">
        <ons-toolbar-button ng-click="menu.toggleMenu()"><ons-icon icon="ion-navicon" style="font-size: 32px; width: 1em;"></ons-icon></ons-toolbar-button> 
    </div>
      <div class="center"> Setting Nomor</div>

      <div class="right">
        <div id="prosesAjax"></div>
      </div>

    </ons-toolbar>

        <ons-list>
            <ons-list-item>
                <input type="text" placeholder="nomor" ng-model="noini"  class="text-input text-input--transparent" style="margin-top:8px; width: 100%;">
            </ons-list-item>
        </ons-list>

        <div class="content-padded">
        <ons-button id="btnSignIn" modifier="large"  ng-click="saveData()">
          Save
        </ons-button>
      </div>
  </ons-page>
</ons-template>

AngularJS Controller

agendaApp.controller('penomoranController',function ($scope){
                 $scope.saveData=function(){
                            $scope.myNavigator.popPage();
                 };


     }); 

the problem is when i clicked Save Button get error NavigatorView's page stack is empty, what's wrong? Thanks for the answer

Upvotes: 0

Views: 856

Answers (1)

Charitha
Charitha

Reputation: 127

menu.setMainPage is setting up a new stack, So in your case there is only one page (nomor.html) in the myNavigator stack. so when you try to popPage there is no other page to go back.

Solution - Try myNavigator.pushPage(nomor.html) so myNavigator stack push the nomor.html to its stack. Then you can popPage.

Upvotes: 1

Related Questions