美文网首页
ionic导航栏处理

ionic导航栏处理

作者: lzb30 | 来源:发表于2016-10-10 13:55 被阅读0次

    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>

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

    相关文章

      网友评论

          本文标题:ionic导航栏处理

          本文链接:https://www.haomeiwen.com/subject/muzmyttx.html