URL없이 상태 사이에 데이터를 전달하는 각도 ui 라우터

Question

나는 두 상태 사이에 데이터를 전달하는이 문제에 직면하고있다. URL에 데이터를 노출하지 않고 사용자가 직접이 상태에 착륙 할 수없는 것과 같다. 예를 들어

. 두 개의 주 "A"와 "B"가 있습니다. 상태 "A"에서 일부 서버 호출을 수행하고 호출의 응답을 "B"로 상태로 전달합니다. 서버 호출의 응답은 매우 긴 문자열 메시지이므로 URL에 공개 할 수 없습니다.

그래서 url 매개 변수를 사용하지 않고 각도 ui 라우터에서 상태간에 데이터를 전달하는 방법이 있습니까?

API Reference/ui.router.state/$stateProvider

params A map which optionally configures parameters declared in the url, or defines additional non-url parameters. For each parameter being configured, add a configuration object keyed to the name of the parameter.

이 부분을 참조하십시오 :

Answer 1

우리는 UI-라우터의 params, 새로운 기능을 사용할 수 있습니다 "을 ... 또는 추가 비 URL 매개 변수를 정의 ... "

그래서 상태 데프은 다음과 같습니다

,307,613,210

몇 가지 예를 형성 doc mentioned above :

// 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 - 작동 예 :이 인터페이스를 사용하여 호출 될 수

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

: 여기

http://plnkr.co/edit/inFhDmP42AQyeUBmyIVl?p=info이 상태 정의의 예 -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> 

예를 확인하십시오. here

Answer 2

params 객체는 $ stateParams에 포함되어 있지만 URL의 일부는 아닙니다. 변화하는

.controller('editUserCtrl', function ($stateParams, $scope) {  
    $scope.paramOne = $stateParams.paramOne; 
    $scope.paramTwo = $stateParams.paramTwo; 
}); 

3A) 제어기

$state.go("edit_user", { 
    user_id: 1,     
    paramOne: { objectProperty: "test_not_default1" }, 
    paramTwo: "from controller" 
}); 

3B에서 상태를 변경)

$stateProvider.state('edit_user', { 
    url: '/users/:user_id/edit', 
    templateUrl: 'views/editUser.html', 
    controller: 'editUserCtrl', 
    params: { 
     paramOne: { objectProperty: "defaultValueOne" }, //default value 
     paramTwo: "defaultValueTwo" 
    } 
}); 

2) 컨트롤러 : 경로 구성에서

1) 상태 (html)

<div ui-sref="edit_user({ user_id: 3, paramOne: { objectProperty: 'from_html1' }, paramTwo: 'fromhtml2' })"></div> 

Example Plunker