Question

我有一个相当简单的Angular路由方案，有两条路由：

aoo.config(['$routeProvider', function($routeProvider) {
    $routeProvider.
        when('/frame', {
            controller: 'FrameCtrl',
      templateUrl: 'ngPartials/frame.html'
        }).
    when('/bar', {
      controller: 'BarCtrl',
      templateUrl: 'ngPartials/bar.html'
    }).
        otherwise({
      controller: 'BarCtrl'
        });
}]);

我有一个简单的CSS过渡：

.fade { transition: all 0.15s ease-out }

我应用另一个触发此转换的类。我想在页面加载时添加此类，并在路由更改时将其删除。 ng-animate指令似乎有点矫枉过正。是否有一种简单干净的方式来完成我想要做的事情？

Answer 1

您可以使用ui-router。它是功能更强大的角度路由库，允许您轻松地在一个页面上嵌套ng视图或多个ng视图。

https://github.com/angular-ui/ui-router

当您的视图（状态）发生变化时，它还有助于动画视图。为此，您需要使用ng-enter，ng-leave指令，这些指令负责在加载或卸载时动画视图/子视图。

你有一些很好的教程与ui-router连接：

Animating views

https://scotch.io/tutorials/3-simple-tips-for-using-ui-router

Answer 2

我不确定我是否完全理解你想要做什么，但我会查看路由更改时发出的$ routeChangeSuccess事件。您可以在应用配置中为此事件设置侦听器，并在每次更改时应用一些逻辑。

Angular：在页面加载后添加类

2 个答案: