>

ui-router를 사용하여 상태로 전환하고 임의의 객체를 전달하고 싶습니다.

나는 보통 $stateParams  가 사용되었지만이 값이 URL에 삽입되었다고 생각하며 사용자가이 데이터를 북마크에 추가하기를 원하지 않습니다.

이와 같은 일을하고 싶습니다.

$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의 의견을 참조하십시오.

    와이즈 비즈

  • 답변 # 2

    이 문제에는 두 부분이 있습니다

    1) URL을 변경하지 않는 매개 변수 사용 (params 속성 사용) :

    christopherthielen: Yes, this should be working now in 0.2.13.

    .state('foo', { url: '/foo/:param1?param2', params: { param3: null } // null is the default value });

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

    $stateParams in 'foo' is now { param1: 'bar', param2: 'baz', param3: { id: 35, name: 'what' } }

    url is /foo/bar?param2=baz.

    2) 객체를 매개 변수로 전달 : 글쎄, 모든 매개 변수가 문자열로 변환되므로 지금 수행하는 직접적인 방법은 없습니다 (편집: 0.2.13부터 더 이상 사실이 아닙니다-객체를 직접 사용할 수 있습니다). 직접 문자열을 만들어 해결 방법을 사용할 수 있습니다

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

    대상 컨트롤러에서 개체를 다시 직렬화 해제합니다

    toParamsJson = JSON.stringify(toStateParams);
    
    

  • 답변 # 3

    실제로 할 수 있습니다.

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

    이것은 state.go의 옵션에 대한 공식 문서입니다

    모든 내용이 여기에 설명되어 있으며이 방법을 볼 수 있습니다.

  • 답변 # 4

    템플릿에서 ui-sref 속성을 사용하여 객체를 전달할 수도 있습니다

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

  • 답변 # 5

    1)

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

    2)

    $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'
                        }
                    }
                })
    
    

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

관련 자료

  • 이전 Spring Batch integration - 스프링 배치 통합 - 작업 외부의 원격 단계를 원격 실행 jvm의 steplocator에 표시하는 방법은 무엇입니까?
  • 다음 c++ - 사용자 정의 객체 포인터의 메모리 관리를위한 안전한 래퍼 클래스 작성