UI 라우터를 사용하여 객체를 상태로 전달하는 방법은 무엇입니까?
ui-router를 사용하여 상태로 전환하고 임의의 객체를 전달하고 싶습니다.
나는 일반적 $stateParams
으로 사용 된다는 것을 알고 있지만이 값이 URL에 삽입되었다고 생각하며 사용자 가이 데이터를 북마크 할 수 있기를 원하지 않습니다.
이런 식으로하고 싶습니다.
$state.transitionTo('newState', {myObj: {foo: 'bar'}});
function myCtrl($stateParams) {
console.log($stateParams.myObj); // -> {foo: 'bar'}
};
URL에 값을 인코딩하지 않고 이것을 수행하는 방법이 있습니까?
버전 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 / : param1? param2', params : {param3 : null} // null이 기본값입니다});
$ state.go ( 'foo', {param1 : 'bar', param2 : 'baz', param3 : {id : 35, name : 'what'}});
'foo'의 $ stateParams는 이제 {param1 : 'bar', param2 : 'baz', param3 : {id : 35, name : 'what'}}입니다.
url은 / foo / bar? param2 = baz입니다.
이 문제에는 두 부분이 있습니다
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);
실제로 당신은 이것을 할 수 있습니다.
$state.go("state-name", {param-name: param-value}, {location: false, inherit: false});
이것은 state.go의 옵션에 대한 공식 문서입니다.
모든 것이 거기에 설명되어 있으며 알 수 있듯이 이것이 완료되는 방법입니다.
그러나 템플릿에서 ui-sref 속성을 사용하여 객체를 전달할 수도 있습니다.
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));
})
아니요, 매개 변수가로 전달되면 URL은 항상 업데이트됩니다 transitionTo
.
이것은 ui-router의 state.js : 698 에서 발생 합니다 .
참고 URL : https://stackoverflow.com/questions/20632255/how-to-pass-an-object-into-a-state-using-ui-router
'Programming' 카테고리의 다른 글
하나의 MongoDB 문서의 _id를 어떻게 업데이트합니까? (0) | 2020.07.15 |
---|---|
“wc -l”을 사용하여 파일 이름없이 줄 수만 인쇄하는 방법은 무엇입니까? (0) | 2020.07.15 |
npm : 패키지 설치 후 스크립트 비활성화 (0) | 2020.07.15 |
JavaScript를 사용하여 브라우저에서 Word 문서 (.doc, .docx)를 어떻게 렌더링합니까? (0) | 2020.07.15 |
Django에서 널을 허용하는 고유 필드 (0) | 2020.07.15 |