sref angularjs angular-ui-router

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.