cordovadom-eventsonsen-ui

Onsen UI postpop event is not firing

I am trying to use onsen ui in Cordova development.

      <body ng-controller="AppController" > 

    <!-- Navigator as root element -->
    <ons-navigator var="myNavigator" ng-controller="SubController" ons-prepush="onPopPost($event)" ons-postpop="onPopPost($event)"> 
        <ons-page>
            <ons-toolbar fixed-style>
                <div class="left"></div>
                <div class="center"><img src=""></div>
                <div class="right"></div>
            </ons-toolbar> 
           <ons-tabbar position="top">
            <ons-tabbar-item active="true" page="latest.html" id="latestTab">
              <div class="tab">
                <ons-toolbar-button class="tabmain" modifier="outline">&nbsp;&nbsp;&nbsp;Latest&nbsp;&nbsp;<span id="notificationLatest" class="notification" style="display:none">*</span></ons-button>
              </div>
            </ons-tabbar-item>    
    </ons-tabbar>  
     </ons-page>  
    </ons-navigator> 

 <ons-template id="latest.html">
      <ons-page ng-controller="MainPageController" fixed-style>  
 </ons-page>
  </ons-template>

In app.js I have 

module.controller('AppController', function($scope,$timeout) {
$scope.onPopPost = function(event) {
        console.log("sad");
        console.log(event.enterPage);

      }

The event is not firing. As per the documentation this is supported. But I could not see this event firing. Is there any other settings I need to do?

Solution

  • Your navigator has the postpop handler but you are not pushing a page in the navigator. You are changing pages in the tabbar and those are different components. Use these events instead: http://onsen.io/reference/ons-tabbar.html#attributes

    <ons-tabbar ng-controller="AppController" ons-postchange="onPopPost($event)" position="top">
   ...
</ons-tabbar>

    Working here: http://codepen.io/frankdiox/pen/NqOELO

    Hope it helps!