Question

这可能已经回答了（如果是，请指出我正确的地方），如果您有任何有效的解决方案，请告诉我。

我正在使用angularjs 1.5.5，angular-ui-router 0.4.2并在刷新浏览器时遇到问题（可能是特定于实现的）。

这是一个伪路由代码示例，它定义了状态以及为状态提供数据的内容，然后可以在控制器中使用这些状态。

    myApp.config(function($stateProvider) {
    // An array of state definitions
    var states = [    
     { 
       name: 'checkout', 
       url: '/checkout',
       templateUrl: 'app/checkout/view/checkout.html',
       controller: 'checkoutController'     

     },

     { 
       name: 'confirm-checkout', 
       url: '/confirmcheckout', 
       params: {model: checkoutModel},
       templateUrl: 'app/checkout/view/confirmcheckout.html',
       controller :'checkoutConfirmationController',
       resolve: {
       person: function(people, $stateParams) {
           return someService.someApi($stateParams.model)
       }
     }
   }
  ]

  // Loop over the state definitions and register them
     states.forEach(function(state) {
       $stateProvider.state(state);
     });
  });

正如您所见，/ confirmcheckout url取决于stateParams提供的数据。让我们说我们导航到/ confirmcheckout url（通过路由器，正确显示confirmcheckout.html，并通过someService.someApi调用解析所有数据。此时，如果我刷新浏览器，angularjs将重新初始化javascript模型/服务等。这意味着，我的stateParams将丢失，页面confirmcheckout.html将丢失所有数据。如何在这种情况下处理页面刷新。不建议使用会话存储和本地存储https://docs.angularjs.org/guide/security（请参阅使用本地缓存）

以下是应用程序从checkout到confirmcheckout的转换过程。

$ state.go（＆＃39; confirmcheckout＆＃39;，{model：someModel}）;

在坚果壳中，如何为依赖stateparams呈现UI的状态实现浏览器刷新？

Answer 1

您可以在网址中保存使用查询参数。

在我们的案例中

   url: '/confirmcheckout?model',

请参阅https://ui-router.github.io/ng1/docs/latest/classes/params.paramtypes.html#query

Angular UI State Params - 浏览器刷新

1 个答案: