保留URL参数ui路由器

Question

我有一个网络应用程序，在另一个应用程序中有一个入口点。所以当用户到达我的应用程序时，他们在url中有一些参数，比如：

http://myapp.com/#/new?param1=value&param2=value2

在我的应用程序中，我有3-4个选项卡，每个选项卡都是它自己的状态，可以使用ui-sref="state" 访问

问题是，当我切换到这些状态中的任何一个时，我都会丢失用户最初使用的参数。

简而言之，当我切换状态时，我想要的只是http://myapp.com/#/differentstate?param1=value&param2=value2而不是http://myapp.com/#/differentstate。

我不知道该怎么设置。。。非常感谢。

Answer 1

在angular应用程序的.run()函数中，您可以执行以下操作：（您需要DI $rootScope和$location）

    var locationSearch;
    $rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams) {
        //save location.search so we can add it back after transition is done
        locationSearch = $location.search();
    });
    $rootScope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState, fromParams) {
        //restore all query string parameters back to $location.search
        $location.search(locationSearch);
    });

Answer 2

设置$location.search仅在您保持在同一窗口中时有效。要锚定所有链接，您必须手动扩展ui sref以包括url参数。现在，您的链接可以"在新选项卡中打开"并保留参数。此代码还包括一个将~2F和%2F转换为/的拼凑，以便您的链接保持一致。为此：

.run(function ($rootScope, $state, $location ) {
  // Url parameters
  var locationSearch = $location.search();
  // Set param1 
  $rootScope.site = {};
  $rootScope.site.param1 = _url_decode_slash(locationSearch.param1);

  // Hack to decode URL params with Slash (/)
  function _url_decode_slash (param) {
      if (!param) return param;
      param = param.replace(/~2F/g, "/"); // Replace all '~2F' to /
      param = param.replace(/%2F/g, "/"); // Replace all '%2F' to /
      return param;
  }
}

然后在你的index.html 中

<a ui-sref="request.add( {param1: site.param1 } )" >