history.pushState 在控制器中不起作用

Question

我的 html 中有这两个按钮：

<a href="" class="sbtn sbtn-default" ng-click="GoToNext()"><i class="fa fa-angle-right"></i> Next </a>
<a href="" class="sbtn sbtn-default" ng-click="GoToPrev()"> Prev <i class="fa fa-angle-left"></i></a>

然后在我的控制器中：

$scope.GoToNext = function () {
    var nextPage = getNextPage("next");

    history.pushState(null, "Site Title", nextPage);
    getQuestion();
}

$scope.GoToPrev = function () {
    var prevPage = getNextPage("prev");

    history.pushState(null, "Site Title", prevPage);
    getQuestion();
}

getNextPage 函数是：

function getNextPage(type) {

    var querystr = window.location.pathname.split('/')[4];
    var currentQuestion = querystr.split("-")[1];
    var currentBook = querystr.split("-")[0];

    switch (type) {
        case "next":
            return ((currentBook + "-") + (+currentQuestion + +1));

        case "prev":
            if (currentQuestion == 1)
                return (currentBook + "-1");

            return ((currentBook + "-") + (+currentQuestion - +1));

    }

};

我的网址是这样的：

http://localhost:14799/app/Dashboard/Question/1-330

getQuestion 函数只是从服务器获取数据，我已经测试过了，它返回数据没有问题，实际上它在页面加载时返回数据没有问题。

我要做的是更改 URL 并通过单击这些按钮来获取下一个或上一个问题。但发生的是它调用 getQuestion 函数但 URL 没有改变。如果我非常仔细地查看 URL 并注意它会非常快速地更改并返回上一页，只需一闪！

我的代码中没有任何内容可以返回上一页。

我尝试的是在 getNextPage 函数中添加 console.log 以查看它是否调用了两次，但它没有，每次点击它只会调用一次。

如果我尝试在控制台中 pushState，它会起作用！

我还在 getQuestion 函数的末尾添加了控制台日志，以查看它是否卡在函数中间，但没有！控制台日志正在发生，但它返回到上一页。

我只是拼命地测试，但没有运气。

Answer 1

一年过去了，我一直在努力解决这个问题，现在我明白了。它不是角度的工作方式。我应该使用 ngRoute 模块来提供导航。它不是关于 pushstate 不起作用或其他什么，而是关于 Angular 的工作原理。

我不需要 $scope.GoToNext 或 $scope.GoToPrev 进行导航，因为 Angular 会自动为我完成。只需更改路线并完成。一切正常。

Answer 2

pushState 在各种浏览器平台上的支持不一致。请改用History.js。