如何使用 ngAnimate 平滑滚动？

Question

我想知道为什么在我的控制器中这不起作用：

angular.module('app', [
        'ngAnimate',
    ])
    .controller('MainCtrl', function ($scope, $log, $window, $document) {
        var scrollTop = 200 // For example
        angular.element(document).find('body').animate({scrollTop: scrollTop}, 'slow');

    });
});

我只是想平滑地滚动到 body 标签顶部的特定偏移量。我必须以不同的方式使用 ngAnimate 吗？

TypeError: angular.element(...).find(...).animate is not a function

Answer 1

ngAnimate与.animate()没有任何关系。此函数与 jQuery 有关，与 AngularJS 无关。因此，一个可行的解决方案将如下所示：

angular.module('app', [
        'ngAnimate',
    ])
    .controller('MainCtrl', function ($scope, $log, $window, $document) {
        var scrollTop = 200 // For example
        $('html, body').animate({scrollTop: scrollTop}, 'slow');

    });
});

Also do not forget to load jquery in your html file before you load the script above.

如何使用 ngAnimate 平滑滚动？

How to smooth scroll with ngAnimate?

javascript

scroll

angularjs

ng-animate