angularjs - sref - ¿Cómo puedo actualizar $ stateParams sin volver a cargar el ui-view? enrutador ui angular
ui sref ui router angularjs (3)
Obtenga el contexto, angular, ui-router, nada especial, una vista de raíz creada con 3 ui-views con nombre. así que en index.html tenemos
<body>
<div ui-view=''left''>
<div ui-view=''center''>
<div ui-view=''right''>
</body>
mi ruta parece
$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@'': .. }
});
¿Hay alguna forma de pasar al estado b para actualizar $ stateParams en la vista ''centro'' e ''izquierda''? Puedo obtenerlo usando un servicio pero necesito agregar un $watch a la variable que necesito y me parece un poco intrincado.
Al entrar en el estado c, puedo obtener lo que quiero, pero la vista se vuelve a cargar, y deseo evitar este comportamiento porque tengo un lienzo en la vista "izquierda".
Citando a @christopherthielen de https://github.com/angular-ui/ui-router/issues/1758#issuecomment-205060258 :
Usar Notify: false casi nunca es una buena idea, y ahora está en desuso. Utilice reloadOnSearch si es necesario.
También puede probar los parámetros dinámicos en la versión 1.0 (actualmente 1.0.0-alpha.3). En su estado, configure un parámetro como dinámico e implemente la devolución de llamada 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. } } });
Para ver una demostración, eche un vistazo a este plunker: http://plnkr.co/edit/T2scUAq0ljnZhPqkIshB?p=preview
Creo que usar "parámetros dinámicos" es ahora una mejor solución:
Cuando dinámico es verdadero, los cambios en el valor del parámetro no harán que se ingrese o salga el estado. Los resuelve no se volverán a recuperar, ni las vistas se volverán a cargar.
$stateProvider.state(''search'', {
url: ''/search?city&startDate&endDate'',
templateUrl: ''some/url/template.html'',
params: {
city: {
value: ''Boston'',
dynamic: true
}
}
}
y entonces:
$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
Puede usar lo siguiente para ir a una ruta específica sin volver a cargar las vistas:
$state.go(''.'', {parm1: 1}, {notify: false});
El último objeto literal representa las opciones que puede pasar para go . Si configura notify en false , esto realmente evitará que los controladores se reinicialicen. El . al principio es el nombre de estado absoluto o la ruta de estado relativa a la que desea ir.
Lo importante es la notify sin embargo.