AngularJS $ anchorScroll yOffset в дочернем элементе

Из того, что я понимаю $ anchorScroll yOffset невозможно в дочернем элементе: «Для корректной работы yOffset прокрутка должна выполняться в корне документа, а не в каком-либо дочернем элементе». https://docs.angularjs.org/api/ng/service/ $ anchorScroll

Пример (измененный из документов AngularJS): Я хочу щелкнуть ссылку и включить слово «между» над тем, что прокручивается.

index.html

<body ng-app="anchorScrollOffsetExample"> 
    <div class="fixed-header" ng-controller="headerCtrl"> 
    <a href="" ng-click="gotoAnchor(x)" ng-repeat="x in [1,2,3,4,5]"> 
     Go to inner-anchor {{x}} 
    </a> 
    </div> 
    <div id="anchor" class="anchor"> 
    <div ng-repeat="x in [1,2,3,4,5]"> 
     between 
     <div id="innerAnchor{{x}}" class="anchor" >Inner-Anchor {{x}} of 5</div> 
    </div> 
    </div> 
</body>

style.css

.anchor { 
    border: 2px dashed DarkOrchid; 
    padding: 10px 10px 200px 10px; 
    max-height:500px; 
    overflow-y: auto; 
    }

script.js

angular.module('anchorScrollOffsetExample', []) 
.run(['$anchorScroll', function($anchorScroll) { 
    $anchorScroll.yOffset = 500; 
}]) 
.controller('headerCtrl', ['$anchorScroll', '$location', '$scope', 
    function ($anchorScroll, $location, $scope) { 
    $scope.gotoAnchor = function(x) { 
     var newHash = 'anchor' + x; 
     if ($location.hash() !== newHash) { 
     $location.hash('innerAnchor' + x); 
     } else { 
     $anchorScroll(); 
     } 
    }; 
    } 
]);

http://plnkr.co/edit/yFj9fL3sOhDqjhMawI72?p=preview

Есть хороший способ сделать это в AngularJS (прив возможно, нет jQuery или дополнительных библиотек), не перемещаясь «между» и внутри DIV, к которой я прокручиваю?

источник

2015-05-30 Sean

Почему бы вам не использовать якорный тэг?

<body ng-app="anchorScrollOffsetExample"> 
    <div class="fixed-header" ng-controller="headerCtrl"> 
    <a href="" ng-click="gotoAnchor(x)" ng-repeat="x in [1,2,3,4,5]"> 
     Go to inner-anchor {{x}} 
    </a> 
    </div> 
    <div id="anchor" class="anchor"> 
    <div ng-repeat="x in [1,2,3,4,5]"> 
     <!-- Add an anchor above the text, and we scroll here instead of the div --> 
     <a name="innerAnchor{{x}}"></a> 
     between 
     <div class="anchor" >Inner-Anchor {{x}} of 5</div> 
    </div> 
    </div> 
</body>

источник

2017-03-24 15:08:52 Alec

AngularJS $ anchorScroll yOffset в дочернем элементе

ответ

Смежные вопросы