看起来我正在监督某事。我刚开始使用OnsenUI。我使用标准的Tabbar选项,并没有真正改变任何东西。我在index.html中有这个
<ons-navigator title="Navigator" var="myNavigator">
<ons-list-item modifier="chevron" class="item" ng-click="myNavigator.pushPage("City1.html", options);">
<ons-row>
<ons-col>
<header>
<span class="item-title">City1</span>
</header>
</ons-col>
</ons-row>
</ons-list-item> </ons-navigator>
我也制作了一个新模板:
<ons-template id="City1.html">
<ons-navigator>
<ons-page>
<ons-toolbar>
<div class="left"><ons-toolbar-button ng-click="doSomething()"><ons-icon icon="ion-compose"></ons-icon></ons-toolbar-button></div>
<div class="center">City1</div>
<div class="right"></div>
</ons-toolbar>
</ons-page>
</ons-navigator>
我想点击City1后滑入City1.html。我做错了什么?
答案 0 :(得分:4)
我认为主要问题是你在同一个字符串中使用“”两次,在这里:
ng-click="myNavigator.pushPage("City1.html", options);"
所以City1.html在实际字符串之外。试试'':
ng-click="myNavigator.pushPage('City1.html', options);"
除此之外,你应该关闭“ons-template”并将每个“ons-list-item”放在“ons-list”中。此外,City1.html中的“ons-navigator”不是必需的。 Check this
您可以阅读有关这些元素的更多信息here。希望它有所帮助!
答案 1 :(得分:1)
谢谢!我解决了这个问题:
<ons-list-item modifier="chevron" class="item" ng-click="myNavigator.pushPage('City1.html', {
animation: 'slide'
});">
放入Home视图的ons-template标签。