現状

Monacaにて、OnsenUI V2 JS Splitterテンプレートを使って、アプリ開発をしています。
トップページのons-toolbar内にボタンを設け、そこにリンクを貼りたいのですが、
正常に動作せず、原因がわからない状態です。

コード

HTML:Onsen
1<ons-template id="home.html">
2    <ons-page>
3      <ons-toolbar>
4        <div class="left">
5          <ons-toolbar-button onclick="fn.open()">
6            <ons-icon icon="md-menu"></ons-icon>
7          </ons-toolbar-button>
8        </div>
9        <div class="center" style="background:url('images/***.png') center bottom no-repeat;background-size:contain;">
10        </div>
11        <div class="right" style="padding-right:15px;">  
12          <ons-toolbar-button onclick="myNavigator.pushPage('search.html', {animation: 'lift'})" tappable>
13            <ons-icon icon="search"></ons-icon>
14          </ons-toolbar-button>
15        </div>
16      </ons-toolbar>

質問

上記コード内において正常に動作しない原因はありますでしょうか？
皆様はOnsenUIにおいてons-buttonでリンクを張る場合、どのように記述していますか？

HTML:
1<ons-button onclick="location.href='***.html`">

のような通常のHTMLの記法だと、OnsenUIのよさが引き出せないため、これは避けたいと思っております。
OnsenUIに慣れておらず、初歩的な質問で申し訳御座いませんがよろしくお願いいたします。

行動規範の内容に同意します

回答1件

自己解決

ons-navigatorを使用していないため、pushPageは使えません。
ons-splitterを使用している場合のページ遷移はloadを使うとのこと。

<div class="right" style="padding-right:15px;">  
   <ons-toolbar-button onclick="content.load('search.html')" tappable>
       <ons-icon icon="search"></ons-icon>
   </ons-toolbar-button>
</div>

とすればできました。

投稿2016/07/17 03:16

NOTK

総合スコア11