ion-view
属于ionNavView

视图内容、导航、标题栏信息的容器。当视图进入并退出其父级(ionic-china中文网文档)ionNavView时, 该视图会发出视图消息,如"标题","是否应该显示后退按钮","是否应显示相应的ionNavBar",过渡视图是否应该使用动画,以及哪个方向的动画。

缓存视图以提高性能。 当视图离开时,其元素保留在DOM中,并且其scope$watch循环断开连接。 当导航到已缓存的视图时,其scope将重新连接,并且保留在DOM中的现有元素再次变为活动状态。 这可以被禁用,或者在$ionicConfigProvider,视图的$state配置或视图本身的属性(见下文)中更改缓存视图的最大数量。

实例该文档来自ionic中文网ionic-china

页面将加载"My Page"为标题的ionNavBar

<ion-nav-bar></ion-nav-bar>
<ion-nav-view>
  <ion-view view-title="My Page">
    <ion-content>
      Hello!
    </ion-content>
  </ion-view>
</ion-nav-view>

视图的生命周期和事件

视图可以缓存,意味着控制器通常只加载一次,这可能会影响你的控制器逻辑。 需要知道视图何时进入或离开,将添加从视图scope中发出的事件。 这些事件包含有关视图的数据,例如标题和后退按钮是否应显示。以及转换数据,例如将被使用或使用的转换类型和方向。

$ionicView.loaded 视图加载完毕。 这个事件只会在每次创建视图并添加到DOM时发生一次。 如果视图离开但缓存,则事件不会在后续查看时再次触发。 加载事件通常用于是放置视图的设置代码,不推荐用于视图变为活动时监听。
$ionicView.enter 视图进入完毕,现在是活动视图。 此事件将触发,无论是第一次加载还是缓存视图。
$ionicView.leave 视图离开完毕,并且不再是活动视图。 此事件将会触发,无论是缓存还是销毁。
$ionicView.beforeEnter 视图即将进入,并成为活动视图。
$ionicView.beforeLeave 视图即将离开,不再是活动视图。
$ionicView.afterEnter 视图进入完毕之后,现在是活动视图.
$ionicView.afterLeave 视图离开完毕之后,并且不再是活动视图。
$ionicView.unloaded 视图的控制器已被销毁,元素已从DOM中删除。

缓存

可以通过多种方式禁用和启用缓存。 默认情况下,Ionic将最多缓存10个视图。 您可以选择在单个视图上禁用缓存 或 通过全局配置禁用缓存。 有关详细信息,请参阅ionNavView中的缓存部分。

API

属性 类型 说明
view-title
(可空)
string

标题文本,将显示在父(ionic-china中文网文档)ionNavBar上。 对于HTML标题(如图像),请参阅(ionic-china中文网文档)ionNavTitle

cache-view
(可空)
boolean

设置视图是否为被缓存。 有关详细信息,请参阅ionNavView中的缓存部分。 默认值true

can-swipe-back
(可空)
boolean

是否允许视图使用滑动手势返回上一级。 如果正在运行的平台不支持滑动返回功能,或者没有之前的视图,则不会被滑动返回。 默认值true

hide-back-button
(可空)
boolean

是否隐藏父标题栏ionNavBar上的后退按钮。 默认值false

hide-nav-bar
(可空)
boolean

是否隐藏父标题栏ionNavBar。 默认值false