Question

在我的网络应用程序中，我在2个不同的网页purchase1和purchase2上收到了一份表单。

如果客户在purchase2刷新页面，我希望将位置更改回purchase1。

我还没有办法这样做，我试图做出这样的配置：

.config(function($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.when('/purchase2', '/purchase1');
}

但显然，这样我就永远无法进入purchase2页面。

我需要它仅在手动用户刷新时才会发生。

有没有办法这样做？一些内置的Angular函数发生在Refresh？

上

像

这样的东西

$scope.onRefresh = function(){
   $location.path('/dashboard/purchase1');
}

Haven没有找到类似的东西。

Answer 1

您可以收听 beforeunload 事件。当有人点击 F5 或无论如何刷新页面时，都会触发 beforeunload 事件。做点什么，

var windowElement = angular.element($window);
windowElement.on('beforeunload', function (event) {
    event.preventDefault();
    //below is the redirect part.
    $window.location.href = '/purchase1';
});

将此代码放在 purchase2 页面上。

Answer 2

是的，你可以做到。

注册状态更改的全局侦听器：

$scope.$on('$stateChangeStart', function(event, toState, toParams, fromState) {
    // If fromState is null that means it is a page refresh otherwise
    // The fromState will be the purchase1
    if (toState.name == 'purchase2' && !fromState) {
        $state.go('purchase1');
        event.preventDefault();
        return;
    }
});

全球化，我的意思是在这样的控制器中注册上述内容，该控制器的范围在整个应用程序中可用，例如添加到body或html标记的控制器。

另外，我假设purchase1＆amp; purchase2是两个页面的状态名称。如果它们是公共状态的参数，您可以更改上面的代码。

Answer 3

刷新时发生的情况与首次加载时发生的情况相同。

您可以做的是检查用户是否已经在这里，例如通过设置cookie并稍后阅读。

但是，我认为你应该重新考虑你的设计。你为什么要花时间让刷新功能变得更糟？

Answer 4

我认为，javascript不是正确的方式，因为javascript对上一页没有任何了解，因为它将在页面已经加载时呈现。因此，尝试在服务器端应用程序中检查这一点，如在php或jsp中，并阅读请求标头，因为您可以获取当前URL并将用户重定向到新URL

Answer 5

您可以尝试使用 purchase2-loaded 标记，并将此变量保留在localStorage中。然后，您可以编写IIFE，它将检查此变量的值并重新路由到 purchase1 。

同样在 purchase1 上，将其重置为false。

注意：这是一个纯JS代码，依赖于localStorage。

Fiddle

示例代码

(function(){
  var isPurchase2Loaded = localStorage.getItem("Purchase2");
  if(isPurchase2Loaded || isPurchase2Loaded === undefined){
    document.write("Rerouting to purchase 1...");
  }
  else{
    document.write("Loading for the first Time...");
    localStorage.setItem("Purchase2", true);
  }
})()

Answer 6

$state.go('purchase1');

这可以解决您的问题。

如何刷新（F5）并使用AngularJS获取另一个页面？

6 个答案:

示例代码