angularjs UI路由器stateparams无形损失的页面刷新 [英] angularjs ui-router stateparams invisible loses on page refresh

查看:364
本文介绍了angularjs UI路由器stateparams无形损失的页面刷新的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

Im在一个角项目,在那里我有我的设置状态,如下图所示工作。

Im working on a angular project, where i have set my states as shown below.

$stateProvider.state('UserPanel', {
    url: '/user',
    params: { userId: null },
    views: {
        'content@': {
            templateUrl: '/AngViews/UserPanel/UserPanel.UserDetails.html'
        }
    }
});

当我浏览到视图,它需要与它的参数,可以让这部分工作。

when i navigate to the view, it takes the params with it, so this part is working.

但是,当我更新的页面,它失去了PARAMS。
我知道,如果我定义的<一的PARAMS href=\"http://stackoverflow.com/questions/31979798/stateparams-getting-null-after-page-refresh\">url变量它会工作。但我想使它不可见。

But when i update the page, it's loses the params. I know that if i defined the params in the url variable it will work. but i want to make it invisible.

我发现类似<一个href=\"http://stackoverflow.com/questions/29942522/angularjs-ui-router-page-refresh-state-current-is-now-empty\">this,但不知道它是否要去解决我的问题。不能得到它,如果它做的工作。任何人谁可以解释这可怎么办呢?

I have found something like this, but don't know if it's gonna fix my problem. can't get it working if it does. anyone who can explain how this can be done?

感谢您的时间

推荐答案

我面临同样的问题,以及与此code

I faced the same problem and solved it with this code

angular.module('app').run(function($rootScope, $state, localStorageService) {

  $rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams) {
   var prefix = "stateParams.";
   var fromStateName = prefix + fromState.name;
   var toStateName = prefix + toState.name;
   var f = true;
   for (var k in toState.params) {
     f = f && (JSON.stringify(toParams[k]) == JSON.stringify(toState.params[k]));
   }
   if (f && localStorageService.get(toStateName) != null) {
     event.preventDefault();
     var savedToParams = localStorageService.get(toStateName); //retrieving toParams from local storage
     localStorageService.remove(toStateName);
     for (var k in toState.params) {
       toParams[k] = savedToParams[k]; //update only the params {} not url params
     }
     $state.transitionTo(toState,toParams);
   } else {
     var toSave = {};
     for (var k in toState.params) {
       toSave[k] = toParams[k]; //save only the params {} not url params
     }
     localStorageService.set(toStateName,toSave);
   }
  });

});

吉斯特

我尝试使用 localStorageService 来缓存的状态转换之间的PARAMS。

I try to use the localStorageService to 'cache' the params between state transitions.

从状态A到状态B的时候,我删除pviously存储A的PARAMS $ P $。

when going from state A to state B , I remove the params previously stored for A.

我然后检查是否正在发送到B在B的状态定义匹配PARAMS的参数,可以,如果他们不配合我加载从localStorage来PARAMS,因为这意味着用户已达到刷新和在PARAMS被重置。

I then check to see if the params that are being sent to B match the params in the state definition of B, and if they do match I load the params from the localStorage , because this means that the user has hit refresh and the params got reset.

我测试的一对夫妇的情况下这code,但它仍然是不充分的测试。

I tested this code on a couple of cases , but it is still not fully tested.

这篇关于angularjs UI路由器stateparams无形损失的页面刷新的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆