返回浏览器上的上一内容“后退”按钮单击

时间:2015-04-03 09:42:50

标签: angularjs angular-routing

我在尝试返回" old"时遇到了麻烦。单击浏览器后退按钮后的内容。

目前,我正尝试对AngularJsSymfony2进行分页:

app.js

var fcrApp = angular.module('fcrApp', ['ngRoute', 'fcrController']);

fcrApp.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {

    $locationProvider.html5Mode(true);
}]);

controller.js

var fcrController = angular.module('fcrController', []);

fcrController.controller('MainController', function ($scope, $compile, $http, $location) {

    $scope.goToPage = function (host, path) {
        var ajaxUrl = changeUrl(host, path);
        getContent(ajaxUrl, path);
        changeBrowserUrl(path);
    }

    function changeBrowserUrl(path) {
        $location.path(path);
    }

    function changeUrl(host, path) {
        var newString = host.replace("www.", "");
        var newHost = newString.replace("http://", "http://ajax.");

        return newHost + path;
    }

    function getContent(link, path) {
        $http.get(link, { cache: true}).success(function (data) {
            angular.forEach(data.divs, function (value, key) {
                var compiledElement = $compile(value)($scope);
                $('#' + key).html(compiledElement);
            });

            $scope.title = data.title;
            if (data.robots) {
                $('meta[name=robots]').attr('content', data.robots);
            }

            $('html, body').animate({
                scrollTop: $("#" + data.scrollTo).offset().top
            }, 500);
        }).error(function () {
            location.assign(linkOld);
        });
    }
});

HTML:

 <a ng-click="goToPage(host, url)">page</a>

点击页面链接后,将通过$http.get()收到新的html内容,并替换旧的内容。问题是,如果我想使用后退按钮返回,则url也会更改为旧的,但当前内容不会。有没有解决办法来实现这个目标?

感谢。

1 个答案:

答案 0 :(得分:1)

我已经解决了我的应用程序遇到的问题。我前几天注意到的一点是每次按/快Back浏览器都会从缓存中加载数据。

幸运的是,在我的情况下,因为我使用服务加载我的数据,我所做的是添加了一个与请求捆绑在一起的标题,如下所示:

myApp.config(['$provide', '$httpProvider', function ($provide, $httpProvider) {
    // snip(...)
    // Prevent content creep on browser Back button
    $httpProvider.defaults.headers.common['Cache-Control'] = 'no-cache';
}]);

现在每次按/ go Back时,浏览器都会被迫从服务器重新加载数据。

希望这有助于其他人。