Làm cách nào để chuyển một đối tượng vào một trạng thái bằng UI-router?

Tôi muốn có thể chuyển đổi sang một trạng thái và chuyển một đối tượng tùy ý bằng cách sử dụng ui-router.

Tôi biết rằng $stateParamsgiá trị đó thường được sử dụng, nhưng tôi tin rằng giá trị này được chèn vào URL và tôi không muốn người dùng có thể đánh dấu dữ liệu này.

Tôi muốn làm một cái gì đó như thế này.

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

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

Có cách nào để làm điều này mà không cần mã hóa các giá trị vào URL không?

Trong phiên bản 0.2.13, Bạn có thể chuyển các đối tượng vào $ state.go,

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

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

và sau đó truy cập tham số trong bộ điều khiển của bạn.

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

myParam sẽ không hiển thị trong URL.

Nguồn:

Xem bình luận của christopherthielen https://github.com/angular-ui/ui-router/issues/983 , được sao chép tại đây để thuận tiện:

christopherthielen: Vâng, điều này sẽ hoạt động ngay bây giờ trong 0.2.13.

.state ('foo', {url: '/ foo /: param1? param2', params: {param3: null} // null là giá trị mặc định});

$ state.go ('foo', {param1: 'bar', param2: 'baz', param3: {id: 35, name: 'what'}});

$ stateParams trong 'foo' hiện là {param1: 'bar', param2: 'baz', param3: {id: 35, name: 'what'}}

url là / foo / bar? param2 = baz.

Có hai phần của vấn đề này

1) sử dụng tham số không làm thay đổi url (sử dụng thuộc tính params):

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

2) truyền một đối tượng dưới dạng tham số: Chà, không có cách nào trực tiếp để thực hiện điều đó ngay bây giờ, vì mọi tham số đều được chuyển đổi thành chuỗi ( CHỈNH SỬA : kể từ 0.2.13, điều này không còn đúng nữa - bạn có thể sử dụng trực tiếp các đối tượng), nhưng bạn có thể giải quyết bằng cách tạo chuỗi của riêng bạn

toParamsJson = JSON.stringify(toStateParams);

và trong bộ điều khiển mục tiêu lại deserialize đối tượng

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

Trên thực tế, bạn có thể làm điều này.

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

Đây là tài liệu chính thức về các tùy chọn trong state.go

Mọi thứ được mô tả ở đó và như bạn có thể thấy đây là cách để được thực hiện.

Btw, bạn cũng có thể sử dụng thuộc tính ui-sref trong các mẫu của mình để chuyển các đối tượng

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

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));


    })

Không, URL sẽ luôn được cập nhật khi các thông số được chuyển đến transitionTo.

Điều này xảy ra trên state.js: 698 trong ui-router .