如何使用UI路由器将对象传递到状态？

javascript angularjs angular-ui-router

2022-08-30 05:07:21

我希望能够使用ui路由器转换到状态并传递任意对象。

我知道通常使用，但我相信这个值入到URL中，我不希望用户能够为此数据添加书签。$stateParams

我想做这样的事情。

$state.transitionTo('newState', {myObj: {foo: 'bar'}});

function myCtrl($stateParams) {
   console.log($stateParams.myObj); // -> {foo: 'bar'}
};

有没有办法在不将值编码到URL中的情况下执行此操作？

答案 1

在版本 0.2.13 中，您应该能够将对象传递到 $state.go，

$state.go('myState', {myParam: {some: 'thing'}})

$stateProvider.state('myState', {
                url: '/myState/{myParam:json}',
                params: {myParam: null}, ...

，然后访问控制器中的参数。

$stateParams.myParam //should be {some: 'thing'}

myParam 不会显示在 URL 中。

源：

请参阅christopherthielen https://github.com/angular-ui/ui-router/issues/983 的评论，为方便起见，请在此处转载：

christopherthielen：是的，现在应该在0.2.13中工作。

.state（'foo'， { url： '/foo/:p aram1？param2'， params： { param3： null } // null 是默认值 }）;

$state.go（'foo'， { param1： 'bar'， param2： 'baz'， param3： { id： 35， name： 'what' } }）;

$stateParams 'foo' 中现在是 { param1： 'bar'， param2： 'baz'， param3： { id： 35， name： 'what' } }

url is /foo/bar？param2=baz.

答案 2

此问题有两个部分

1）使用不会改变 url 的参数（使用 params 属性）：

$stateProvider
    .state('login', {
        params: [
            'toStateName',
            'toParamsJson'
        ],
        templateUrl: 'partials/login/Login.html'
    })

2）将对象作为参数传递：好吧，现在没有直接的方法，因为每个参数都转换为字符串（EDIT：从0.2.13开始，这不再是真的 - 你可以直接使用对象），但你可以通过自己创建字符串来解决它

toParamsJson = JSON.stringify(toStateParams);

并在目标控制器中再次反序列化对象

originalParams = JSON.parse($stateParams.toParamsJson);