Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

How to not init every times when change anothor tab from ons-tab



  • When i change tab then init again. Pleas help me.

    detail.html

    <ons-page ng-controller="NegotiationDetailController as negotiationController" ons-show="negotiationController.init()">
    <ons-tabbar swipeable var="negotiation_tabbar" position="top">
        <ons-tab id="negotiation-content-tab0" label="CONTENT" page="negotiation/detail/content.html"></ons-tab>
        <ons-tab id="negotiation-content-tab1" label="COMMENT" page="negotiation/detail/comment.html"></ons-tab>
        <ons-tab id="negotiation-content-tab2" label="NOTICE" page="negotiation/detail/notice.html"></ons-tab>
      </ons-tabbar>
    </ons-page>
    

    content.html

    <ons-page>
      <ons-list>
        <ons-list-item id="schedule_date_area">
          <div class="project-list-item">
            <div>
              <div class="project-list-title-area-wrap">Time</div>
            </div>
            <div>
              <div class="project-list-item-area">
                <input class="form-control" name="schedule_date" id="schedule_date">
                <div>
                  <input name="schedule_start_time" type="time" value="09:00" style="width: 45%" id="schedule_start_time" type="text">
                  <input name="schedule_end_time" type="time" value="10:00" style="width: 45%" id="schedule_end_time" type="text">
                </div>
              </div>
              <div id="schedule"></div>
            </div>
          </div>
        </ons-list-item>
    	
    	...
    
      </ons-list>
    </ons-page>
    

    detail.js

    use strict';
    
    angular
        .module('app.core')
        .controller('NegotiationDetailController', function(NegotiationFormBase, NegotiationDetailService, $scope, $timeout) {
    
            this.init = function() {
    
                var id = navigationManager.getNavigationObject().topPage.data.id;
                NegotiationDetailService.initData(id, $scope, $timeout);
                NegotiationDetailService.initRelatedNegotiation(id, $scope, $timeout);
            };
    });
    

  • administrators

    The problem is you are using ons-show here:

    <ons-page ng-controller="NegotiationDetailController as negotiationController" ons-show="negotiationController.init()">
    

    This will call init every time there is a show event i.e. every time the tab is changed.

    I think replacing ons-show with ons-init should fix your problem in this case. If not, take a look at the various ons- attributes for page and tabbar:

    https://onsen.io/v2/api/angular1/ons-page.html#attributes
    https://onsen.io/v2/api/angular1/ons-tabbar.html#attributes