Javascript 如何防止angular在使用ng视图切换路由时同时渲染两个视图_Javascript_Angularjs_Ng Animate_Angular Strap

Javascript 如何防止angular在使用ng视图切换路由时同时渲染两个视图

javascript angularjs

Javascript 如何防止angular在使用ng视图切换路由时同时渲染两个视图,javascript,angularjs,ng-animate,angular-strap,Javascript,Angularjs,Ng Animate,Angular Strap,我将angularjs与AngularStrap一起使用，我有一个ng视图，它充当我视图的主容器，并随着每次路线更改而更新。我的问题是Angular显示了两个视图，我看了这个问题，但它并没有真正回答我的问题，即如何防止它，或者对它应用好的动画，因为现在它只在一瞬间显示旧视图下的新视图。我尝试了ng animate=fadeIn，ng animate={enter:'am fade and scale'，leave:'am-fade-and-scale'}，ng animate={enter:'f

我将angularjs与AngularStrap一起使用，我有一个ng视图，它充当我视图的主容器，并随着每次路线更改而更新。我的问题是Angular显示了两个视图，我看了这个问题，但它并没有真正回答我的问题，即如何防止它，或者对它应用好的动画，因为现在它只在一瞬间显示旧视图下的新视图。我尝试了ng animate=fadeIn，ng animate={enter:'am fade and scale'，leave:'am-fade-and-scale'}，ng animate={enter:'fadeIn'，leave:'fadeOut'}和ng animate=none，在所有情况下我都没有得到任何动画，并且两者都是同时可见的。我的HTML在下面

<body id="body">
 <div snap-content style="background-color: white">
     <div class="nav-contain" ng-controller="SidebarController">
         <ng-include src="'js/pages/sidebar.html'"></ng-include>
     </div>
     <div class="contain" ng-view autoscroll="true" ng-animate="{enter: 'am-fade-and-scale', leave:'am-fade-and-scale'}"></div>
 </div>
</body>

更新：

我确实得到了动画作品，我应该把动画的名字写在课堂上，但问题仍然是，它将新内容置于旧内容之下。因此，您可以同时看到两组内容。

是否看到顶部的侧栏，然后是模板？是的，侧栏按我们的预期显示，但ng视图中的内容显示在页面顶部，旧内容显示在页面顶部，新内容显示在页面下方的瞬间，即使使用动画，您也可以共享这两个模板吗？最好是创建一个plunker