Question

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

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

我想做这样的事情。

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

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

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

Answer 1

这个问题有两个部分

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

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

2）传递一个对象作为参数：好吧，没有direct way how to do it now,，因为每个参数都转换为字符串（编辑：自0.2.13以来，这不再是真的 - 你可以直接使用对象），但你可以解决它通过自己创建字符串

toParamsJson = JSON.stringify(toStateParams);

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

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

Answer 2

实际上你可以这样做。

$state.go("state-name", {param-name: param-value}, {location: false, inherit: false});

This is the official documentation about options in state.go

在那里描述了一切，你可以看到这是要做的事情。

Answer 3

顺便说一下，您还可以在模板中使用ui-sref属性来传递对象

ui-sref="myState({ myParam: myObject })"

Answer 4

1）

$stateProvider
        .state('app.example1', {
                url: '/example',
                views: {
                    'menuContent': {
                        templateUrl: 'templates/example.html',
                        controller: 'ExampleCtrl'
                    }
                }
            })
            .state('app.example2', {
                url: '/example2/:object',
                views: {
                    'menuContent': {
                        templateUrl: 'templates/example2.html',
                        controller: 'Example2Ctrl'
                    }
                }
            })

2）

.controller('ExampleCtrl', function ($state, $scope, UserService) {


        $scope.goExample2 = function (obj) {

            $state.go("app.example2", {object: JSON.stringify(obj)});
        }

    })
    .controller('Example2Ctrl', function ($state, $scope, $stateParams) {

        console.log(JSON.parse($state.params.object));


    })

Answer 5

不，当params传递给transitionTo时，URL将始终更新。

这发生在state.js:698的ui-router上。

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

5 个答案: