AngularJS中如何设置一个计时器，如果URL包含参数为x，则滚动到元素ID？

Question

如何在URL包含参数的情况下，设置AngularJS的定时器滚动到一个ID？顺便说一下，这个URL是外部的，所以它不是来自我的网站。

我的问题是这样的

1. 用户点击 "看今天的促销 "这个词，URL为www.mySite.com#index#today，从邮件中发出。展望 (强调它来自外部链接，因此我不能放置href等，也不能修改 <a> 标签，因为没有htmlit是外部的。

2. 当他们点击 链接 它转到www.mySite.com#index，并删除#today。因此不会向下滚动到#today的位置。

3. 当他们回到outlook，并再次点击链接，#today工作，并没有被删除，它也会向下滚动到#today的位置。也会向下滚动到它所在的位置。必须要访问这个网站才行。

我在网上搜了一下，他们还是没有任何解决外部链接的方案，我看到的都是针对站内的方案，他们编辑自己的 <a> 标签。

我试过下面这些，但都没有用。

Sol'n 1

*other routeProviders here*
...
$routeProvider.when('/index', {
        templateUrl: 'app/views/index.htm'
    });

$routeProvider.otherwise({ redirectTo: '/index#today' });

但#只变成了%23或者被删除了

Sol'n 2

我也试过这个scrollTo:

app.directive('scrollto',
    function ($anchorScroll, $location) {
        return {
            link: function (scope, element, attrs) {
                element.click(function (e) {
                    e.preventDefault();
                    $location.hash(attrs["scrollto"]);
                    $anchorScroll();
                });
            }
        };
    })

并将outlook中的链接改为www.mySite.com#index?scrollTo=today，但忘记了scrollTo是一个属性，因此它应该被置于 <a> 标签，我说的对吗？但是我们使用的是外部链接，所以我们不能在outlook中编辑任何东西，除了他们的添加链接功能。

Sol'n 3

最后我也试过这个。

...
$routeProvider.when('/index', {
        controller: 'myCtrl',
        templateUrl: 'app/views/index.htm'
    });
...

app.run(function ($rootScope, $location, $anchorScroll, $timeout) {
    $rootScope.$on("$routeChangeSuccess", function (event, next, current) {
        if ($location.hash()) {
            $timeout(function () { $anchorScroll() }, 5);
        } else {
            window.scrollTo(0, 0);
        }
    });
});

app.controller('myCtrl', ['$scope', '$location', '$anchorScroll',
    function ($scope, $location, $anchorScroll) {
        $scope.gotoBottom = function () {
            $location.hash('today');
            $anchorScroll();
        };
    }]);

但还是不行 (还是一样，还是要双击)

To be Sol'n 4

所以我想也许我可以。

1. 在Outlook链接中手动放置一个参数。example: www.mySite.com/#/index?scrollMe=today

2. 检索那个被手动输入到网址框里的参数 或者手动输入到outlook邮件的网址里的参数。

3. 然后也许可以添加一个计时器，比如2秒或1秒，在页面加载后滚动到参数的ID，也就是今天。

定时器的目的是，也许自动滚动不会工作，因为页面还没有加载，它已经在滚动了？可能不是，但我想确定定时器的部分，所以我想让它至少在滚动前等待一秒钟。我想一秒钟不会伤害任何人。我也可以把它降低到毫秒，但定时器只是为了测试。

我真的是AngularJS的新手，我真的很想问问各位前辈和专家，有没有什么变通的办法 :(

干杯!

Answer 1

你可以使用"... "这个词。$routeParams 因此，它将是这样的 -

$routeProvider.when('/index/:when', {
   controller: 'myCtrl',
   templateUrl: 'app/views/index.html'
});

app.controller('myCtrl', ['$scope', '$routeParams', '$location', '$anchorScroll'
    function ($scope, $routeParams, $location, $anchorScroll) {
        var goToId = $routeParams.when;
        $location.hash(goToId);
        $anchorScroll();
    }]);

我的index.html有如下内容

<div id="today" style="margin-top: 2000px;">
  This div shows today's contents
</div>

最后，url应该是这样的 /#/index/today 或 /#/index/yesterday

AngularJS文档供参考- https:/docs.angularjs.orgtutorialstep_09。