ionic导航栏处理

2016-10-10  本文已影响0人  lzb30

view-title - 视图标题文字

模板被载入导航视图ion-nav-view显示时,这个属性值将显示在导航栏ion-nav-bar中

cache-view - 是否对这个模板视图进行缓存

允许值为:true | false,默认为true

hide-back-button -是否隐藏导航栏中的返回按钮

当模板被载入导航视图时,如果之前有其他的模板,那么在导航栏ion-nav-bar上默认会自动 显示返回按钮(使用指令ion-nav-back-button定义)。点击该按钮将返回前一个模板。

hide-back-button的允许值为:true | false ,默认为false

注意:必须在导航栏中显式地声明返回按钮,否则即使将hide-back-button属性设为false, 这个按钮也不会出现:-)

hide-nav-bar - 是否隐藏导航栏

允许值为:true | false ,默认为false

在中添加 hide-nav-bar 属性

导航栏 : ion-nav-bar

ion-nav-bar指令用来声明一个居于屏幕顶端的导航栏,它的内容随导航视图 的状态变化而自动同步变化:

1. <ion-nav-bar></ion-nav-bar>

ion-nav-bar有以下可选的属性:

align-title - 标题对齐方式

允许值为: left | right | center。默认为center,居中对齐

no-tap-scroll - 点击导航栏时是否将内容滚动到顶部。

允许值为:true | false。默认为true,这意味着如果视图中的内容下拉很长,那么在任何时刻 点击导航栏都可以立刻回到内容的开头部分。

回退按钮 : ion-nav-back-button

你可能已经注意到前一节的示例中,当切换到小说页时,无处可去了!

好在ionic的指令ion-nav-back-button指令可以自动地让你回退到前一个视图:

<ion-nav-bar>

    <ion-nav-back-button></ion-nav-back-button>

</ion-nav-bar>

当视图切换时,回退按钮会自动出现在导航条中,并显示前一个视图 的标题。点击回退按钮将返回前一个视图。

上一篇下一篇

猜你喜欢

热点阅读