旋转幻灯片效果与ng hide / show和ng-animate?

时间:2013-08-07 17:41:39

标签: angularjs ng-animate ng-show

我有一个滑块式旋转木马,有两个可以左右滑动的剖面容器。在我的开发版本中,我在一个部分容器中有图像。我遇到的问题是,因为我的服务器图像需要一段时间来加载我发现当用户点击后退按钮时,页面再次被添加到DOM(由于ng切换)并且不得不重新加载图片。

我的问题:是否有办法使用ngif或隐藏/显示,以便页面只是隐藏时设置display:none,以便当前未显示的页面容器不会从DOM中删除?

  <!--ANIMATE-->
  <div ng-animate="{enter: 'enter', leave: 'leave';}" ng-switch on="par.selection">
    <!--PAGE1-->
    <div class="page page1" ng-switch-when="settings">
        <b>page 1</b><br><br>
        <button  ng-click="par.selection = 'home'; go('front');"  >go page 2</button>
    </div>

    <!--PAGE2-->
    <div class="page page2" ng-switch-when="home">
        <b>page 2</b><br><br>
        <button  ng-click="par.selection = 'settings'; go('back');"  >go page 1</button>
    </div> 
  </div>

Plunkr: LINK

我在几天前访问过的博客上做了上面的例子,我似乎无法再找到了,但上面的例子使用了ng-switch方法。

0 个答案:

没有答案