Angular – Elegir dinámicamente el estado de inicio

Mi aplicación se inicia automáticamente en el estado predeterminado (que tiene url: “/”), obviamente. Llamémoslo estado A

Quiero refrenarme a eso en caso de que cierta condición sea verdadera. Lo que significa que si x === 4 por ejemplo, quiero que el estado B sea ​​el primero que se cargue.

Mi problema es que para cuando compruebo esa condición, por ejemplo, en app.run , el estado predeterminado ya se está cargando y se presenta en la vista, y solo entonces cambia al estado B

¿Hay alguna manera de retener el estado de carga y ponerlo en marcha solo después de verificar la condición?

2 Solutions collect form web for “Angular – Elegir dinámicamente el estado de inicio”

Hay un ejemplo de trabajo.

Como se comentó en los comentarios, podemos usar las funciones nativas incorporadas que vienen con UI-Router. Uno de ellos es $ urlRouterProvider.deferIntercept (diferir)

Desactiva (o habilita) el aplazamiento de la intercepción de cambio de ubicación.

Si desea personalizar el comportamiento de sincronización de la URL (por ejemplo, si desea diferir una transición pero mantener la URL actual), llame a este método en el momento de la configuración. Luego, en tiempo de ejecución, llame a $urlRouter.listen() después de haber configurado su propio controlador de eventos $locationChangeSuccess .

I. paso – detener la ejecución

Entonces, podemos definir estados en la fase .config()

 .config(['$stateProvider', '$urlRouterProvider','$locationProvider', function ($stateProvider, $urlRouterProvider,$locationProvider) { // States $stateProvider ... .state('parent', { ... }) .state('parent.child', { ... }) ; ... // here we say STOP $urlRouterProvider.deferIntercept(); } ]) 

II. paso – inicia lo que se necesita en .run () – vuelve a habilitar la ejecución

Esto podría ser un ejemplo ingenuo de ejecución:

 .run(['$urlRouter', '$timeout', '$state', function($urlRouter, $timeout, $state) { $timeout(function(){ // here we turn all on again... $urlRouter.sync(); $urlRouter.listen(); // there could be some decision, driven by $http load // we just use some state as default target $state.go("parent.child"); }, 1000) }]); 

Se espera un segundo y luego se vuelve a habilitar toda la ejecución y se redirige a “parent.childd” … pero podría ser cualquier otro, según la decisión tomada en la fase .run()

Compruébalo aquí

Hacer uso de la resolución . si está utilizando ngRoute

 $routeProvider .when('/' ,{ templateUrl: "templates/A.html", resolve:{ "check":function($location){ if(x==4){ $location.path('/B'); } } } }) .when('/B' ,{ templateUrl: "templates/B.html" }) .otherwise({redirectTo: '/'}); 
  • ¿Cómo uso Angular JS como motor de templates?
  • Elementos de polymer frente a directivas angulares
  • $ rootScope no funciona conmigo en AngularJs
  • ¿Cómo presionar las notifications con angular.js?
  • UI Router Extras rompe mis testings de unidad con un error de resultados inesperados?
  • Cuál es el mejor lugar para almacenar ng-templates en Angular / Django SPA
  • AngularJS: ¿A dónde pertenece el código que actualiza un campo de formulario una vez que se ha resuelto una promise?
  • Directiva AngularJS para nombre de label específico
  • Foundation-Apps integración de sitio angular con testing de unidad karma-jasmine
  • Cómo deshabilitar ngTouch condicionalmente y recurrir a ng-click
  • ¿Cómo agregar valores de cadena a nvd3 line chart x axis values?
  • Javascript tiene muchos buenos JS marco (como Node.js AngularJS Vue.js React.js) es el mejor lenguaje de script.