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));

    }

};

我的 Url 是这样的：

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

getQuestion 函数只是从服务器获取数据，我已经对其进行了测试并且 return 数据没有问题，实际上它 return 页面加载时的数据没有问题。

我想做的是更改 URL 并通过单击这些按钮获取下一个或上一个问题。但实际情况是它调用了 getQuestion 函数，但 URL 没有改变。如果我仔细观察 URL 并注意它会发生变化并非常非常快地返回到上一页，只需一闪！

我的代码中没有任何内容可以 return 转到上一页。

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

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

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

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

Answer 1

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

Answer 2

一年来我一直在努力解决这个问题，现在我明白了。这不是 angular 的工作原理。我应该使用 ngRoute 模块来提供导航。这与 pushstate 不工作或其他问题无关，它与 angular 的工作方式有关。

我不需要 $scope.GoToNext 或 $scope.GoToPrev 来导航，因为 angular 会自动为我完成。只需更改路线即可完成。一切正常。

history.pushState 在控制器中不工作

history.pushState not working in controller

pushstate

angularjs

html5-history