如何在Angular-Material主题中进行平滑滚动

How to do Smooth Scroll in Angular-Material theme?

本文关键字:平滑 滚动 Angular-Material      更新时间:2023-09-26

我正在开始一个新项目,并使用AngularJS的Angular Material。我有麻烦,使顺利滚动工作。我正在使用这个平滑滚动库:https://github.com/oblador/angular-scroll

我也试了这个:https://github.com/d-oliveros/ngSmoothScroll但它们都不起作用。我在这里做了一个代码依赖来演示这个问题:

http://codepen.io/hughred22/pen/XmRpOG/

正如你在Codepen中看到的,如果我注释掉

document.getElementById('bottom').scrollIntoView(true);

显示scrollIntoView工作,它滚动到div。但平滑滚动不会工作的原因。请帮助!

应该使用合适的容器来启动滚动。在这里查看codependency的固定分支http://codepen.io/harconst/pen/qOmPVo

注意,在我的代码中,容器不再是整个文档。

var someElement = angular.element(document.getElementById('bottom'));
var container   = angular.element(document.getElementById('container'));    
container.scrollTo(someElement,0,1000);