如何使templateURL滚动到页面的特定部分？

Question

bounty到期在7天内。该问题的答案有资格获得+ 50声望赏金。Nolan Kr希望引起更多关注对此问题：

我需要一个切实可行的解决方案或为此解决。请尽我所能帮助我。我真的对angular.js陌生。

你们能帮助我的routeProvider吗？

$routeProvider.when('/farm', {
        templateUrl: '/index.htm#farm'
    });

#farm不起作用。我想要它，以便当有人单击Outlook中的Farm链接时，它将转到索引页面并向下滚动到ID为farm的位置。我的div也已经具有Farm的ID，所以我认为没有问题。

我已经阅读了很多资源和解决方案，但是所有人都说锚标记在templateURL上不起作用。我想知道你们是否为此工作。

顺便说一下，示例链接是：www.test.com/index#farm单击Outlook电子邮件中的该链接不会向下滚动到#farm所在的位置。相反，它会转到索引页面并将URL变成仅/index，而没有#farm

这里是我代码的另一部分，以防这些家伙弄乱了它：

$locationProvider.hashPrefix('');

    $routeProvider.when('/index', {
        templateUrl: '/index.htm'
    });
    $routeProvider.when('/farm', {
        templateUrl: '/index.htm#farm'
    });
    $routeProvider.when('/error', {
        templateUrl: '/error.htm'
    });
    $routeProvider.otherwise({ redirectTo: '/index' });

我认为.otherwise正在将其转到index.htm。是否还有其他方法可以添加另一个routeProvider和templateURL，它们可能会向下滚动到索引页面中服务器场的位置？

[当我尝试templateURL: '/index.html#farm'时，它仅转到/index%23farm，不会向下滚动。

所以基本上，链接是外部的（来自电子邮件），如果他们单击它，我希望他们向下滚动到#farm所在的位置。

Answer 1

使用$ anchorScroll（）;

将$ anchorScroll注入到您的控制器中，并以此来使用它。

https://docs.angularjs.org/api/ng/service/ $ anchorScroll

 // the element you wish to scroll to.
  $location.hash('farm’);

  // call $anchorScroll()
  $anchorScroll();