Angularjs - 通过在地址栏中手动输入 url 导航到特定的 div答案

【问题标题】：Angularjs - navigating to a specific div via manually entering url into address barAngularjs - 通过在地址栏中手动输入 url 导航到特定的 div
【发布时间】：2014-10-02 21:11:54
【问题描述】：

假设我在索引页面上有两个 div：

<div id="divA"></div>
<div id="divB"></div>

使用 Angular（假设通过路由），有没有办法手动输入导航到所述页面上特定 div 的 url（在地址栏中）。

http://website.com/divA
http://website.com/divB

我遇到过通过锚标签来实现它的方法，但我的任务是找出一种方法，当用户在地址栏中输入特定的 url 时。如果有人可以解释潜在的解决方案，我将不胜感激。

【问题讨论】：

您需要任何动画来滚动到 div 位置吗？
不，只是又快又脏。
你看过这个答案吗：stackoverflow.com/questions/14712223/…
我刚才扫描了一下，好像没有提供手动输入地址到地址栏导航到特定div的解决方案。
使用当前位置

标签： html angularjs

【解决方案1】：

我假设你使用 AngularJS 的路由作为页面。

一旦调用页面控制器触发一个基于当前位置的动作，一个好办法就是触发一个动作。你可以使用 $anchorScroll() (doc here)

一旦你找到你所在的位置，使用 ng-click，你只需调用函数：

<div id="scrollArea" ng-controller="ScrollController">
  <a id="middle"></a> You are in /divA
  <a id="bottom"></a> You are in /divB
</div>

还有 javascript：

  app.controller('ScrollController', ['$scope', '$location', '$anchorScroll',
    function ($scope, $location, $anchorScroll) {
        if($location.path() == "/divA"){
            $location.hash('middle');
         }
        else if($location.path() == "/divB"){
            $location.hash('bottom');
        }
        // call $anchorScroll()
        $anchorScroll();
    }]);

【讨论】：