在AngularJS中删除页面刷新/重新加载上的$ location搜索

时间:2019-07-03 05:01:47

标签: javascript angularjs

如果用户重新加载页面或刷新页面,我需要从Url中清除stateParams(搜索参数)。我正在使用AngularJS 1.5.8。

我可以检测到reload / refresh事件,甚至可以输出到控制台,但是删除搜索参数的代码不会触发。这就是我正在使用的

var windowElement = angular.element($window);
windowElement.on('beforeunload', function (event) {
    $location.url($location.path());
    console.info("page refreshed." + $location.path());        
});

有指针吗?

2 个答案:

答案 0 :(得分:1)

尝试

$location.search({});

删除所有参数。如果您要删除特定的内容,则

$location.search('key', null);

应该可以解决问题。

还请检查$ destroy侦听器,该侦听器告诉angular在控制器/指令的$ destroy上调用此函数。

$scope.$on('$destroy', function () {
   $location.search({});
});

文档中的内容不多...但是它是here

答案 1 :(得分:1)

希望这对其他人有帮助,因为我在SO上看到的所有建议都没有奏效。我设法使用 app.run 函数中的以下代码来创建一种破解方法,以使其正常工作。

$rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams) {
    //not coming from any other page + coming to ads page + contains query string
    if (fromState.name == "" && toState.name == "current_page" && toState.url !== "/current-page-url") {
        $location.search({});
    }
});

它的作用是,如果我从其他页面进入页面,它将填充fromState,但是当我重新加载当前页面时,fromState将没有数据,而toState将显示当前页面的详细信息。为避免连续循环,我还要检查当前url是否包含任何查询字符串。

更新 甚至是更好的解决方案。从此link找到了一些帮助。

$rootScope.$on("$locationChangeStart", function (event, next, current) {
        //Page reload detection
        if (next == current && && performance.navigation.type == 1) {
            event.preventDefault();
            $location.search({});
        }
    });

第一个解决方案即使在您第一次通过查询字符串加载带有查询字符串的页面时也删除了查询字符串。

第二种解决方案按预期工作。

请参阅以下内容以供参考:https://developer.mozilla.org/en-US/docs/Web/API/Window/performance