Javascript 如何使用角度卷轴和角度卷轴创建磁性垂直卷轴？

我有一个角度结构的网站，有一系列的网页与部分。这些页面的每一部分都相应地继承了窗口框架的宽度和高度，这样当您垂直滚动时，它们就变成了完整的排列

我想根据垂直磁性卷轴部分重新创建从该站点“”找到的效果。这将保持帧的位置，直到通过某个阈值。我对右边的帧位置表示不感兴趣，因为角度滚动已经很好地处理了这个问题

因此，有谁能帮我想出如何为我写下这部分吗

以下是我目前的代码：

 $scope.goToSection = function( section ) {
        console.log(' section loaded with section: ', section );
        clearTimeout( $scope.timeout );

        $scope.humanScrolling = false;

        var top = 0;
        var duration = 2000; //milliseconds

        var someElement = angular.element( document.getElementById( section ) );

        $document.scrollToElement( someElement, top, duration);
      };

      $scope.delay = 100; // delay before last scroll action
      $scope.timeout = null;

      $document.on('scroll', function() {
        // console.log('Document scrolled to ', $document.scrollLeft(), $document.scrollTop());

        var topPosition = $document.scrollTop();

        if ( !$scope.directionTracker ) {
          console.log('directionTracker was empty');
          $scope.directionTracker = topPosition;
        } else if ( topPosition === $scope.directionTracker ) {
           // same value so ignore
        } else if ( topPosition > $scope.directionTracker ) {

          if ( topPosition ) {

            console.log('going down');
            $scope.$apply();

            $scope.directionTracker = topPosition;

            if ( $scope.scrolling === false ) {
              // $scope.scrolling = true;
              clearTimeout( $scope.timeout );
              $scope.timeout = setTimeout(function(){
                // alert('scrolling stopped');
                console.log("lastscroll down");

                if ( $scope.humanScrolling ) {
                  $scope.goToSection('container-section-' + ( $scope.currentSection + 1) );
                } else {
                  $scope.timeout = setTimeout(function(){
                    $scope.humanScrolling = true;
                    clearTimeout( $scope.timeout );
                  }, 200 );
                }

              }, $scope.delay );
            }
          }

        } else if ( topPosition < $scope.directionTracker ) {

          if ( topPosition ) {

            console.log('going up');
            $scope.$apply();

            $scope.directionTracker = topPosition;

            if ( $scope.scrolling === false ) {
              // $scope.scrolling = true;
              clearTimeout( $scope.timeout );
              $scope.timeout = setTimeout(function(){
                // alert('scrolling stopped');
                console.log("lastscroll up");

                if ( $scope.humanScrolling ) {
                  $scope.goToSection('container-section-' + $scope.currentSection );
                } else {
                  $scope.timeout = setTimeout(function(){
                    $scope.humanScrolling = true;
                    clearTimeout( $scope.timeout );
                  }, 200 );
                }

              }, $scope.delay );
            }
          }

        }
      });

$scope.goToSection=函数（节）{
log（'section loaded with section:'，section）；
clearTimeout（$scope.timeout）；
$scope.humanScrolling=false；
var-top=0；
var duration=2000；//毫秒
var someElement=angular.element（document.getElementById（section））；
$document.scrollToElement（someElement，top，duration）；
};
$scope.delay=100；//上次滚动动作前的延迟
$scope.timeout=null；
$document.on（'scroll'，function（）{
//log（'Document滚动到'，$Document.scrollLeft（），$Document.scrollTop（））；
var-topPosition=$document.scrollTop（）；
如果（！$scope.directionTracker）{
log（'directionTracker为空'）；
$scope.directionTracker=topPosition；
}else if（topPosition===$scope.directionTracker）{
//相同的值，所以忽略
}else if（topPosition>$scope.directionTracker）{
if（顶置）{
console.log（'going down'）；
$scope.$apply（）；
$scope.directionTracker=topPosition；
如果（$scope.scrolling==false）{
//$scope.scrolling=true；
clearTimeout（$scope.timeout）；
$scope.timeout=setTimeout（函数（）{
//警报（“滚动停止”）；
log（“上次向下滚动”）；
如果（$scope.humanScrolling）{
$scope.goToSection（'container-section-'+（$scope.currentSection+1））；
}否则{
$scope.timeout=setTimeout（函数（）{
$scope.humanScrolling=true；
clearTimeout（$scope.timeout）；
}, 200 );
}
}，$scope.delay）；
}
}
}else if（topPosition<$scope.directionTracker）{
if（顶置）{
console.log（“上升”）；
$scope.$apply（）；
$scope.directionTracker=topPosition；
如果（$scope.scrolling==false）{
//$scope.scrolling=true；
clearTimeout（$scope.timeout）；
$scope.timeout=setTimeout（函数（）{
//警报（“滚动停止”）；
log（“上次向上滚动”）；
如果（$scope.humanScrolling）{
$scope.goToSection（'container-section-'+$scope.currentSection）；
}否则{
$scope.timeout=setTimeout（函数（）{
$scope.humanScrolling=true；
clearTimeout（$scope.timeout）；
}, 200 );
}
}，$scope.delay）；
}
}
}
});

谢谢你的时间和考虑

干杯