离子页面转换

Question

我很难理解 Ionic 如何处理 ion-nav-view 与 ion-view。我正在尝试构建一个未嵌套视图的应用程序（例如示例应用程序）。这就是我所做的

在 index.html 我有一个 ion-nav-view
我有 3 页。 1 个登录、1 个列表和 1 个项目（项目是被点击的列表项目）
我的列表页面是 ion-side-menus，而其他 2 个是 ion-view 的

现在回答我的问题

当我单击列表中的某个项目时，我会跳转到我的项目页面，但是当我返回到我的列表时，没有页面跳转。这是HTML

 <ion-header-bar class="bar-dark">
   <div class="buttons">

  <button nav-transition="slide-left-right" class="button button-icon button-clear ion-android-arrow-back" ui-sref="list">
</div>
    <h1 class="title">Item</h1>

</ion-header-bar>

即使每个页面都有自己的 ion-view，我如何才能使转换正常工作？

编辑我使用 nav-direction="back"

解决了 "transition back"

下一个问题是过渡只适用于列表中的那些吗？

如果我点击上面的左滑过渡发生，但如果我返回并再次按下它我没有得到过渡？它是某种缓存吗？

Answer 1

我的做法是在 index.html 里面有 ion-side-menus 作为唯一的指令，并且在里面有 ion-nav-view 。

然后使用 side="left" 定义一个 ion-side-menu 并包含您要显示的列表。这样您就可以定义一个侧边菜单，该菜单将显示在整个应用程序中并提供您需要的所有内容。

现在回答你的问题，我认为列表页面（在你的情况下是带有离子侧菜单的页面）在返回时没有过渡，因为它现在是离子视图。页面转换发生在离子视图上，当它们在 .但是 ion-side-menus 页面并没有交换，它就在那里。

对此：

EDIT I solved the "transition back" using nav-direction="back"

之所以有效，是因为您明确告诉 ionic 您想要在返回时进行导航转换。

希望对您有所帮助

离子页面转换

Ionic page transitions

transitions

ionic