javascript - Angular + HTML 5 推送状态错误

Question

我的 Angular 版本是 1.2.16，我的模块是这样配置的:

publicApp.angularModule = angular.module('Public', [ 'ui.select2', 'infinite-scroll',  'ngSanitize',  'ui.utils'])
.config(function ($locationProvider) {
$locationProvider.html5Mode(true);

});

在我的 Controller 中我有这段代码:

  publicApp.angularModule.controller('PublicProfileMain', function ( $scope, $http) {

  $scope.onProgressClick = function () {
        removeClasses();
        progress.addClass("active");
        $scope.sourceMain = '/Templates/Pages/Public/Profile/ProfileStatsBasic.html';
        var stateObject = { url: "progress", type: "progress" };
        history.pushState(stateObject, "progress", "progress");
        $('html, body').animate({ scrollTop: 0 }, 'fast');

    };
});

为什么我会收到这些错误？

    "Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
Watchers fired in the last 5 iterations: [["fn: $locationWatch; newVal: 52; oldVal: 51"],["fn: $locationWatch; newVal: 53; oldVal: 52"],["fn: $locationWatch; newVal: 54; oldVal: 53"],["fn: $locationWatch; newVal: 55; oldVal: 54"],["fn: $locationWatch; newVal: 56; oldVal: 55"]]

编辑

有什么方法可以用 angular 实现深度链接吗？

Answer 1

我仍然不知道为什么会这样，甚至更多，当我包含这一行时:

$locationProvider.html5Mode(true);

Angular 弄乱了我的服务器端路由(我的整个路由都是由 ASP.net MVC 设置的，我没有使用 Angular 配置任何路由)。

我想出的最好的事情是:

使用 $location 我像这样更改 URL:

$location.hash("feed");

不幸的是，由于这个原因，我的网址现在看起来很糟糕。像这样:

mysite.com/userName##feed

这可以通过将 html5Mode 设置为 true 来避免，但正如我所说，它会扰乱我的 ASP.net MVC 路由(here is SO link on my question about that)

我有堆栈，我可以在其中推送我的 url，例如:

 $scope.onFeedClick = function () {
    removeClasses();
    feed.addClass("active");
    $scope.sourceMain = '/Templates/Pages/Public/Profile/ProfileFeed.html';
    //var stateObject = { url:"feed", type: "feed" };
    //history.pushState(stateObject, "feed",  "feed");

    $location.hash("feed");
    urls.push("feed");

    $('html, body').animate({ scrollTop: 0 }, 'fast');
};

我的 window.onpopstate 看起来像这样:

 window.onpopstate = function() {

    urls.pop();
    var urlToSet = urls.pop();

    if (urlToSet == "progress") {

        $scope.onProgressClick();
        $scope.$apply();

    }
    else if (urlToSet == "feed") {

        $scope.onFeedClick();
        $scope.$apply();

    }
    else if (urlToSet == "profile") {
        $scope.onHomeClick();
        $scope.$apply();

    }

};

我也是这样处理刷新的:

 var hash = $location.hash();

if (hash) {

    if (hash == "profile") {
        $scope.onHomeClick();



    }
    else if (hash == "feed") {

        $scope.onFeedClick();


    }
    else if (hash == "progress") {

        $scope.onProgressClick();

    }
}

我不知道这是解决我的问题的最佳解决方案(甚至更正一个)但它有效，我欢迎任何建议和改进；