1

Monaca と Onsen UI を使い始めたばかりで、ページにスライド メニューとナビゲーターが設定されています。私は ons-back-button を持っていますが、これはページスタックのサイズが少なくとも 2 でない限り表示されるべきではありません。

JavaScript関数を呼び出すとボタンが消えるため、resetToPage呼び出しでページが適切に更新されない可能性があります。ナビゲーターで console.log を呼び出すと、pages: Array[1] が返されますが、それを呼び出すと戻るボタンも削除されるため、実際に起こっていることではない可能性があります。

ページ1

<ons-navigator var="myNavi">
  <ons-page>
    <ons-button ng-click="myNavi.resetToPage('nextpage.html')">
      Go
    </ons-button>
  </ons-page>
<ons-navigator>

ページ2

<ons-page>
  <ons-toolbar>
    <ons-back-button>
      Back
    </ons-back-button>
  </ons-toolbar>
</ons-page>
4

1 に答える 1

1

解決策を見つけました。$rootScope.$digest()遷移終了時に呼び出します。

angular.module('app', ['onsen'])
.controller('Page3Controller', function($rootScope, $scope){
  $scope.digest = function(){
    $rootScope.$digest();
  };
});
<link href="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.12/build/css/onsen-css-components.css" rel="stylesheet"/>
<link href="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.12/build/css/onsenui.css" rel="stylesheet"/>
<script src="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.12/build/js/angular/angular.min.js"></script>
<script src="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.12/build/js/onsenui.min.js"></script>

<body ng-app="app">

  <ons-template id="page1.html">
    <ons-page>
      <ons-toolbar>
        <div class="left"><ons-back-button>Back</ons-back-button></div>
        <div class="center">Page1</div>
      </ons-toolbar>
      <ons-button ng-click="myNavi.pushPage('page2.html')">Push</ons-button>
    </ons-page>
  </ons-template>

  <ons-template id="page2.html">
    <ons-page>
      <ons-toolbar>
        <div class="left"><ons-back-button>Back</ons-back-button></div>
        <div class="center">Page2</div>
      </ons-toolbar>
      <ons-button ng-click="myNavi.pushPage('page3.html')">Push</ons-button>
    </ons-page>
  </ons-template>

  <ons-template id="page3.html">
    <ons-page ng-controller="Page3Controller">
      <ons-toolbar>
        <div class="left"><ons-back-button>Back</ons-back-button></div>
        <div class="center">Page3</div>
      </ons-toolbar>
      <ons-button ng-click="myNavi.resetToPage('page1.html', {onTransitionEnd: digest})">Reset</ons-button>
    </ons-page>
  </ons-template>
  
<ons-navigator var="myNavi" page="page1.html"><ons-navigator>
</body>


アップデート

このバグは、バージョン 1.3.13 で修正されました。
https://github.com/OnsenUI/OnsenUI/releases/tag/1.3.13

于 2015-11-08T15:23:48.063 に答える