如何使用角度和角度滚动创建磁性垂直滚动？

Question

我有一个Angular结构，用于包含一系列带有部分的页面的网站。这些页面的每个部分都会相应地继承窗口框架的宽度和高度，这样当您垂直滚动时，它们就会成为完全展开。

我想根据垂直磁性滚动部分重新创建从此网站“http://andrewgooch.com/”找到的效果。这使帧保持在适当的位置，直到达到某个阈值。并且我对右边框架位置的表示不感兴趣，因为角度滚动处理已经非常好了。

因此，任何人都可以帮我弄清楚如何为角度写出那部分吗？

到目前为止，这是我的代码：

 $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 );
            }
          }

        }
      });

感谢您的时间和考虑。

干杯，