Angular 没有承诺的锚定卷轴

Question

我正在尝试在 Angular 1.x 中使用一个非常简单的 scrollTo。我有导航菜单 link，点击后应该滚动到 div#id。我只能让它与 'promise'.

一起使用

例如，这个有效：

<li><a href="#" ng-click="tracking()">Go to Tracking</a></li>


$scope.tracking = function() { // go to tracking when header button is clicked
        $http.get('/includes/modules/get_home_destinations.php')
        .then(function(reply){
            if (reply.data) {
                $scope.destinations = reply.data;
                $location.hash('home-tracking');
            }         
        });
    };

但这没有响应：

$scope.tracking = function() { // go to tracking when header button is clicked
     $location.hash('home-tracking');
};

好像需要一个承诺，但要在没有承诺的情况下通过简单的点击让它工作？

Answer 1

希望下面的代码有用：

在html文件中

<div id="home-tracking">
    <h1>Home Traking Content</h1>
</div>

<a ng-click="tracking()">Go to Tracking</a>

在控制器文件中

angular.module('trackingApp').controller('TrackingCtrl', function($location, $anchorScroll) {
    $scope.tracking = function() {
          $location.hash('home-tracking');
          $anchorScroll();
    }
})

Answer 2

我猜这是因为 href="#"。因为首先，href 将页面重定向到“#”，然后延迟执行承诺并将后页重定向到所需位置。但是没有承诺，没有时间延迟，代码立即执行并且 href 将页面重定向到 '#' 并且页面卡在那里。

Angular 没有承诺的锚定卷轴

Angular Anchor Scroll without Promise

angularjs

promise

anchor-scroll