OnsenUIでpushpageが読み込まれません

Question

document.querySelectorを使って画面移動をしています。
最初のpushPageはうまくいくのですが、ブラウザを戻って再度pushPageを読み込もうとするとエラーとなってしまいます。

コードは以下のようなものです。

page1.html

<ons-navigator id="pageone" page="page1.html"></ons-navigator>   
<ons-template id="page1.html">  
</ons-template>

page2.html

<ons-navigator id="pagetwo" page="page2.html"></ons-navigator>   
<ons-template id="page2.html">  
</ons-template>

実行文

document.querySelector('#pageone').pushPage('page2.html',
                       {callback:function(){...}});

エラー

Uncaught TypeError: Cannot read property 'pushPage' of null

Comments

[namimon]

「戻る」というのは、ブラウザバックですか？popPageですか？ページ移動ですか？

[seri]

ブラウザバックです

Answer 1

そもそも、onsen-uiはSPA(Single Page Application)という概念で設計されていて、
ページ操作はDOMの書き換えのみで行うので、onsen内であればブラウザの「戻る」「進む」という操作は発生しないはずです。
（疑似的に「戻る」に見せかけたpopPageという関数や<ons-back-button>というテンプレートパーツはあります）

省略された部分がありますが、提示されたコードを見るとonsenの文法的に正しく設計されていないように見えます。
下記を試してみてください。

1.ページの「戻る」は

document.querySelector('#pageone').popPage();

で行う。
以下は蛇足になります

2.pagetwo内にてDOM操作を行わないなら、

<ons-navigator id="pagetwo" page="page2.html"></ons-navigator> 

は不要

3.パーツとして再利用しないのなら
ons-templateではなく、ons-page

このページが、やりたいことに近いと思われます。（popPageの代わりに、<ons-back-button>を使っていますが）