AngularJS ui路由器在没有URL的状态之间传递数据

一尘不染

AngularJS ui路由器在没有URL的状态之间传递数据

angularjs

我面临着在两个状态之间传递数据而不暴露url中数据的问题，就像用户不能真正直接进入此状态一样。

例如。我有两个状态“ A”和“ B”。我正在状态“ A”进行一些服务器调用，并将调用的响应传递到状态“
B”。服务器调用的响应是一个字符串消息，该消息很长，因此我无法在url中公开它。

那么，有角度的ui路由器中有什么方法可以在不使用url参数的情况下在状态之间传递数据吗？

阅读 222

2020-07-04

共1个答案

一尘不染

我们可以使用params，新的UI，路由器的功能：

API参考/ ui.router.state / $ stateProvider

params一个映射，可以选择配置在url中声明的参数，或定义其他非URL参数。对于每个要配置的参数，添加一个键入参数名称的配置对象。

参见以下部分：“ …或定义其他非URL参数… ”

因此状态def为：

$stateProvider
  .state('home', {
    url: "/home",
    templateUrl: 'tpl.html',
    params: { hiddenOne: null, }
  })

上面的文档很少有示例：

// define a parameter's default value
params: {
  param1: { value: "defaultValue" }
}
// shorthand default values
params: {
  param1: "defaultValue",
  param2: "param2Default"
}

// param will be array []
params: {
  param1: { array: true }
}

// handling the default value in url:
params: {
  param1: {
    value: "defaultId",
    squash: true
} }
// squash "defaultValue" to "~"
params: {
  param1: {
    value: "defaultValue",
    squash: "~"
  } }

EXTEND-工作示例：http :
//plnkr.co/edit/inFhDmP42AQyeUBmyIVl?p=info

这是状态定义的示例：

 $stateProvider
  .state('home', {
      url: "/home",
      params : { veryLongParamHome: null, },
      ...
  })
  .state('parent', {
      url: "/parent",
      params : { veryLongParamParent: null, },
      ...
  })
  .state('parent.child', { 
      url: "/child",
      params : { veryLongParamChild: null, },
      ...
  })

这可能是使用ui-sref的调用：

<a ui-sref="home({veryLongParamHome:'Home--f8d218ae-d998-4aa4-94ee-f27144a21238'
  })">home</a>

<a ui-sref="parent({ 
    veryLongParamParent:'Parent--2852f22c-dc85-41af-9064-d365bc4fc822'
  })">parent</a>

<a ui-sref="parent.child({
    veryLongParamParent:'Parent--0b2a585f-fcef-4462-b656-544e4575fca5',  
    veryLongParamChild:'Child--f8d218ae-d998-4aa4-94ee-f27144a61238'
  })">parent.child</a>

在这里查看示例

2020-07-04