¿Cuál es la diferencia entre ruta angular y enrutador angular-ui?
Estoy planeando usar AngularJS en mis aplicaciones grandes. Estoy en el proceso de encontrar los módulos correctos para usar.
¿Cuál es la diferencia entre ngRoute
los módulos (angular-route.js) y ui-router (angular-ui-router.js)?
En muchos artículos cuando ngRoute
se utiliza, las rutas se configuran con $routeProvider
. Sin embargo, cuando se usa con ui-router, las rutas se configuran con $stateProvider
y $urlRouterProvider
.
¿Qué módulo debo utilizar para una mejor capacidad de gestión y extensibilidad?
ui-router es un módulo de terceros y es muy potente. Admite todo lo que puede hacer el ngRoute normal, así como muchas funciones adicionales.
Aquí hay algunas razones comunes por las que se elige ui-router en lugar de ngRoute:
ui-router permite vistas anidadas y múltiples vistas con nombre . Esto es muy útil con aplicaciones más grandes donde puedes tener páginas que heredan de otras secciones.
ui-router le permite tener enlaces de tipo fuerte entre estados basados en los nombres de los estados. Cambiar la URL en un lugar actualizará todos los enlaces a ese estado cuando cree sus enlaces con
ui-sref
. Muy útil para proyectos más grandes donde las URL pueden cambiar.También existe el concepto de decorador que podría usarse para permitir que sus rutas se creen dinámicamente en función de la URL a la que se intenta acceder. Esto podría significar que no necesitará especificar todas sus rutas de antemano.
Los estados le permiten mapear y acceder a información diferente sobre diferentes estados y puede pasar información fácilmente entre estados a través de
$stateParams
.Puede determinar fácilmente si se encuentra en un estado o en el estado principal de un estado para ajustar el elemento de la interfaz de usuario (resaltando la navegación del estado actual) dentro de sus plantillas a través
$state
de ui-router, que puede exponer configurándolo$rootScope
enrun
.
En esencia, ui-router es ngRouter con más funciones, pero debajo de las hojas es bastante diferente. Estas funciones adicionales son muy útiles para aplicaciones más grandes.
Más información:
- Github: https://github.com/angular-ui/ui-router
- Documentación:
- Referencia de API: http://angular-ui.github.io/ui-router/site/#/api
- Guía: https://github.com/angular-ui/ui-router/wiki
- Preguntas frecuentes: https://github.com/angular-ui/ui-router/wiki/Frequency-Asked-Questions
- Aplicación de muestra: http://angular-ui.github.io/ui-router/sample/#/
ngRoute es un módulo desarrollado por el equipo de AngularJS que anteriormente formaba parte del núcleo de AngularJS.
ui-router es un marco que se creó fuera del proyecto AngularJS para mejorar y mejorar las capacidades de enrutamiento.
De la documentación del enrutador ui :
AngularUI Router es un marco de enrutamiento para AngularJS, que le permite organizar las partes de su interfaz en una máquina de estado. A diferencia del servicio $route en Angular Core, que está organizado en torno a rutas URL, UI-Router está organizado en torno a estados, que opcionalmente pueden tener rutas, así como otros comportamientos, adjuntos.
Los estados están vinculados a vistas con nombre, anidadas y paralelas, lo que le permite administrar poderosamente la interfaz de su aplicación.
Ninguna de las dos es mejor, tendrás que elegir la más adecuada para tu proyecto.
Sin embargo, si planea tener vistas complejas en su aplicación y le gustaría tratar con la noción "$state". Te recomiendo que elijas ui-router.
ngRoute es un módulo central angular que es bueno para escenarios básicos. Creo que agregarán funciones más potentes en próximas versiones.
URL: https://docs.angularjs.org/api/ngRoute
Ui-router es un módulo contribuido que supera los problemas de ngRoute. Principalmente vistas anidadas/complejas.
URL: https://github.com/angular-ui/ui-router
Algunas de las diferencias entre ui-router y ngRoute:
ngRoute es parte del marco central de AngularJS.
ui-router es una biblioteca comunitaria que se creó para intentar mejorar las capacidades de enrutamiento predeterminadas.
Aquí hay un buen artículo sobre cómo configurar/instalar el enrutador ui:
http://www.ng-newsletter.com/posts/angular-ui-router.html