angularjs – 使用ng-include保留传统锚定行为

My understanding is that using ng-include implicitly tells Angular
that I want to use the routes system and overrides the browser’s
native anchor link behavior. I’ve seen recommendations to work around
this by changing my html anchor links to #/#foo,but I can’t do that
for other reasons.

路由系统是在一个单独的模块ngRoute中定义的,所以如果你没有自己注入它 – 而且我很确定你没有 – 它完全无法访问.

这个问题在某种程度上是不同的.

ng-include取决于：$http,$templateCache,$anchorScroll,$animate,$sce.因此,使用ng-include启动所有这些服务.

调查最自然的候选人是$anchorScroll. $anchorScroll的代码似乎没有任何损害,但服务依赖于$window,$location,$rootScope. $location的616行说：

baseHref = $browser.baseHref(),// if base[href] is undefined,it defaults to ''

所以基本上,基本href设置为”,如果之前没有设置的话.

现在看HERE – from BalusC answer：

As to using named anchors like,with the tag
you’re basically declaring all relative links relative to it,
including named anchors. None of the relative links are relative to
the current request URI anymore (as would happen without the
tag).

如何缓解这个问题？

我今天没有太多时间,所以不能自己测试,但我会尝试检查作为第一个选项是挂钩到‘$locationChangeStart’事件,如果新的URL是#xxxxxx类型只是防止默认行为并滚动与$anchorScroll替代原生方法.

更新

我认为这段代码应该做的工作：

$scope.$on("$locationChangeStart",function (event,next,current) {

    var el,elId;

    if (next.indexOf("#")>-1) {
        elId = next.split("#")[1];
        el = document.getElementById(elId);
        if(el){
           // el.scrollIntoView(); do not think we need it
           window.location.hash = "#" + elId;
           event.preventDefault();
        }    
    }
});