ui-view? angular ui 라우터를 다시 로드하지 않고 $stateParams를 업데이트하려면 어떻게 해야 합니까?
컨텍스트, 각도, ui-router, 특별한 것 없이 3개의 이름 있는 ui-view로 구축된 루트 뷰를 가져옵니다.그렇게 해서index.html우리는 가지고 있다.
<body>
<div ui-view='left'>
<div ui-view='center'>
<div ui-view='right'>
</body>
내 경로는 다음과 같습니다.
$stateProvider
.state('main', {
url: '/',
views: {
'left': {templateUrl: 'foo.html'},
'center': {templateUrl: 'bar.html'},
'right': {templateUrl: 'xyz.html'}
}
})
.state('main.b', {
url: '/b',
params: { foo: {value: 'bar'} }
views: { 'right@': {templateUrl: '123.html'} } // I wish to update $stateParams in 'left@' view
})
.state('main.c', {
url: '/c',
params: ...
views: { 'left@': ..., 'center@': ..., 'right@': .. }
});
$stateParams를 'center' 보기와 'left' 보기로 업데이트하기 위해 b state로 이동하는 방법이 있습니까?서비스를 이용해서 받을 수는 있지만 추가해야 합니다.$watch제가 필요로 하는 변수인데 제가 보기엔 좀 어색해 보입니다.
c 상태로 들어가면 실제로 원하는 것을 얻을 수 있지만 뷰가 다시 로드되고 '왼쪽' 뷰에 캔버스가 있기 때문에 이 동작을 피하고 싶습니다.
다음을 사용하여 뷰를 다시 로드하지 않고 특정 경로로 이동할 수 있습니다.
$state.go('.', {parm1: 1}, {notify: false});
마지막 개체 리터럴은 전달할 수 있는 옵션을 나타냅니다.go. 설정하면notify로.false, 이것은 실제로 컨트롤러가 재초기화 되는 것을 막을 것입니다..처음에는 절대 상태 이름 또는 상대 상태 경로가 있습니다.
중요한 것은.notify그래도.
이제 "Dynamic params"를 사용하는 것이 더 나은 해결책이라고 생각합니다.
동적이 참일 경우 매개 변수 값을 변경해도 상태가 진입/종료되지 않습니다.결정이 다시 불러오지 않고 보기가 다시 로드되지도 않습니다.
$stateProvider.state('search', {
url: '/search?city&startDate&endDate',
templateUrl: 'some/url/template.html',
params: {
city: {
value: 'Boston',
dynamic: true
}
}
}
그 다음:
$state.go('.', {city: 'London'});
https://ui-router.github.io/ng1/docs/latest/interfaces/params.paramdeclaration.html#dynamic https://github.com/angular-ui/ui-router/issues/2709
https://github.com/angular-ui/ui-router/issues/1758#issuecomment-205060258 의 @christopherthielen의 말을 인용하면 다음과 같습니다.
notify: false를 사용하는 것은 거의 좋은 생각이 아니며 현재는 사용되지 않습니다.필요한 경우 reloadOnSearch를 사용합니다.
1.0 버전(현재 1.0.0-alpha.3)에서도 동적 파라미터를 시도할 수 있습니다.상태에서 매개 변수를 동적으로 구성하고 uiOnParamsChanged 콜백을 구현합니다.
.state('foo', { url: '/:fooId', params: { fooId: { dynamic: true } }, controller: function() { this.uiOnParamsChanged = function(changedParams, $transition$) { // do something with the changed params // you can inspect $transition$ to see the what triggered the dynamic params change. } } });
데모를 보려면 다음 플렁커(http://plnkr.co/edit/T2scUAq0ljnZhPqkIshB?p=preview 를 보십시오.
언급URL : https://stackoverflow.com/questions/33484457/how-can-i-update-stateparams-without-reloading-the-ui-view-angular-ui-router
'it-source' 카테고리의 다른 글
| C++의 Mariadb Kerberos 인증 (0) | 2023.10.23 |
|---|---|
| jQuery Mobile:동적으로 추가되는 컨텐츠의 마크업 향상 (0) | 2023.10.23 |
| 각진 재료 및 글꼴 변경 (0) | 2023.10.23 |
| 억만장자 웃음 XML DoS 공격은 어떻게 작동합니까? (0) | 2023.10.23 |
| gradle로 스프링 응용 프로그램 디버그하는 방법 (0) | 2023.10.18 |