离子侧菜单应用程序 - 更改离子导航视图类

时间:2014-11-01 23:47:58

标签: ionic-framework

我是离子的新手,我对指令很失落..无法弄清楚何时使用什么..

我已经启动了侧边菜单应用

我无法找到一种方法将离子导航栏的dircetive类从bar-stable改为其他任何东西..

我也不太明白它应该如何工作..我的index.html body标签应该只包含

    <ion-nav-view>

</ion-nav-view>

有人知道从离子开始的好指南吗?他们是如此误导......

1 个答案:

答案 0 :(得分:1)

要更改导航栏类,请检查此编解码器:http://codepen.io/ionic/pen/tcIGK

<ion-nav-bar class="bar-positive"animation="no-animation">

是的,对于基本的sidemenu应用程序,您的身体应该只包含导航视图。假设你正在使用github(https://github.com/driftyco/ionic-starter-sidemenu/blob/master/index.html)上的离子启动器侧面项目,你的身体应该是这样的:

<body ng-app="starter">
    <ion-nav-view></ion-nav-view>
</body>

这只是设置应用程序的外壳。更重要的,多肉的部分在模板文件中,作为父母&#34;或者在您应用的配置中设置的主模板。在Ionic的情况下,通常您将使用状态:

.state('app', {
  url: "/app",
  abstract: true,
  templateUrl: "templates/menu.html",
  controller: 'AppCtrl'
})

您会注意到这一点指向menu.html(https://github.com/driftyco/ionic-starter-sidemenu/blob/master/templates/menu.html)。在该文件中,设置了实际的侧面菜单以及其他模板内容的另一个导航视图。

<ion-pane ion-side-menu-content>
    <ion-nav-bar class="bar-stable nav-title-slide-ios7">
      <ion-nav-back-button class="button-clear"><i class="icon ion-ios7-arrow-back"></i> Back</ion-nav-back-button>
    </ion-nav-bar>
    <ion-nav-view name="menuContent" animation="slide-left-right"></ion-nav-view>
</ion-pane>

对于一些初学者水平的教程,我将有点自我服务并建议我的博客:

http://mcgivery.com/tag/ionicframework/

一个很好的起点是我关于离子应用程序结构的文章,它对整体的高级细节进行了很好的介绍。

http://mcgivery.com/structure-of-an-ionic-app/

如果您对特定教程有任何要求,请随时在Twitter上与我联系。 (@andrewmcgivery)

希望这会有所帮助。 :)

相关问题