当前位置:/AngularJS API/ng/服务(service)/$anchorScroll

ng

根据HTML5的规则,当调用这个函数时,它检查当前的url的hash值并且滚动到相应的元素。

监听$location.hash()并且滚动到url指定的锚点的地方。可以通过$anchorScrollProvider.disableAutoScrolling()禁用。


依赖

$window

$location

$rootScope


用法

$anchorScroll();


实例

<div id="scrollArea" ng-controller="ScrollController">
  <a ng-click="gotoBottom()">Go to bottom</a>
  <a id="bottom"></a> You're at the bottom!
</div>
angular.module('anchorScrollExample', [])
.controller('ScrollController', ['$scope', '$location', '$anchorScroll',
  function($scope, $location, $anchorScroll) {
    $scope.gotoBottom = function() {
      // set the location.hash to the id of
      // the element you wish to scroll to.
      $location.hash('bottom');

      // call $anchorScroll()
      $anchorScroll();
    };
  }]);
#scrollArea {
  height: 280px;
  overflow: auto;
}

#bottom {
  display: block;
  margin-top: 2000px;
}