0

我正在为我们正在开发的 Web 应用程序构建一个功能。应用程序在 AngularJS 1.0.7 上运行

功能如下:用户可以非常传统地导航应用程序,深入了解内容级别。一个 ng-view,几个控制器,里面有更多的控制器和部分。

常规状态

在 4 个第一级内容中,用户可以看到“路径”(与面包屑相同): 打开概览

这就是事情变得有趣的地方。当用户单击其中一个级别时,该级别将展开并且该级别的内容将在其中。原本打开的内容会往下滑: 在此处输入图像描述

作为更好地理解它的参考,想想 Evernote 的移动应用程序。在那里,您使用相同的机制在同一级别的视图之间切换,因此每个级别都可以由一个父级中的控制器表示。

然而,就我而言,所有 4 个级别都是分层结构。在第 1 级您可以选择查看多个第 2 级,在第 2 级您可以查看多个不同的第 3 级。

我想看看如何使它成为可能。我需要在过渡期间保持以前的和新的内容可见。

4

1 回答 1

0

最后,我巧妙地使用了虚拟元素来实现该功能。

触发导航时:

  • 容器元素被复制并替换了实际内容
  • 实际容器已移出屏幕
  • 动画开始将虚拟元素从屏幕和实际内容区域转移到它的位置
于 2014-03-25T14:36:56.263 回答