AngularJS es un marco web basado en JavaScript , gratuito y de código abierto descontinuado para desarrollar aplicaciones de una sola página . Fue mantenido principalmente por Google y una comunidad de individuos y corporaciones. Su objetivo era simplificar tanto el desarrollo como las pruebas de dichas aplicaciones proporcionando un marco para las arquitecturas modelo-vista-controlador (MVC) y modelo-vista-modelo (MVVM) del lado del cliente, junto con componentes comúnmente utilizados en aplicaciones web y progresivas. aplicaciones web .
AngularJS se utilizó como interfaz de la pila MEAN , que constaba de la base de datos MongoDB , el marco del servidor de aplicaciones web Express.js , el propio AngularJS (o Angular ) y el entorno de ejecución del servidor Node.js.
A partir del 1 de enero de 2022, Google ya no actualiza AngularJS para solucionar problemas de seguridad, compatibilidad del navegador o jQuery . [3] [4] [5] El equipo de Angular recomienda actualizar a Angular (v2+) como el mejor camino a seguir, pero también proporcionaron algunas otras opciones. [6]
El marco AngularJS funcionó leyendo primero la página del lenguaje de marcado de hipertexto (HTML), que tenía atributos HTML personalizados adicionales integrados. Angular interpretó esos atributos como directivas para vincular partes de entrada o salida de la página a un modelo representado por variables estándar de JavaScript . Los valores de esas variables de JavaScript se pueden establecer manualmente dentro del código o recuperarse de recursos JSON estáticos o dinámicos .
AngularJS se basó en la creencia de que la programación declarativa debería usarse para crear interfaces de usuario y conectar componentes de software , mientras que la programación imperativa era más adecuada para definir la lógica empresarial de una aplicación . [7] El marco adaptó y amplió el HTML tradicional para presentar contenido dinámico a través del enlace de datos bidireccional que permitió la sincronización automática de modelos y vistas. Como resultado, AngularJS restó importancia a la manipulación explícita del Modelo de objetos de documento (DOM) con el objetivo de mejorar la capacidad de prueba y el rendimiento.
Los objetivos de diseño de AngularJS incluyeron:
AngularJS implementó el patrón MVC para separar los componentes de presentación, datos y lógica. [8] Utilizando la inyección de dependencia , Angular llevó servicios tradicionalmente del lado del servidor , como controladores dependientes de la vista, a aplicaciones web del lado del cliente. En consecuencia, se podría reducir gran parte de la carga sobre el servidor.
AngularJS utilizó el término "alcance" de una manera similar a los fundamentos de la informática.
El alcance en informática describe cuándo en el programa un enlace particular es válido. La especificación ECMA-262 define el alcance como: un entorno léxico en el que se ejecuta un objeto Función en scripts web del lado del cliente; [9] similar a cómo se define el alcance en el cálculo lambda . [10]
Como parte de la arquitectura "MVC", el alcance forma el "Modelo", y se puede acceder a todas las variables definidas en el alcance mediante la "Vista" y el "Controlador". El alcance se comporta como un pegamento y une la "Vista" y el "Controlador".
La tarea realizada por el bootstrapper de AngularJS se produjo en tres fases [11] después de que se cargó el DOM:
Las directivas de AngularJS permitieron al desarrollador especificar elementos y atributos personalizados y reutilizables similares a HTML que definen los enlaces de datos y el comportamiento de los componentes de presentación. Algunas de las directivas más utilizadas fueron:
ng-animate
Dado que ng-*
los atributos no son válidos en las especificaciones HTML, data-ng-*
también se pueden utilizar como prefijo. Por ejemplo, ambos ng-app
y data-ng-app
son válidos en AngularJS.
ng-app
ng-aria
ng-bind
<span ng-bind="name"></span>
muestra el valor de 'nombre' dentro del elemento span. Cualquier cambio en la variable 'nombre' en el alcance de la aplicación se refleja instantáneamente en el DOM.ng-class
ng-controller
ng-if
ng-init
ng-model
ng-bind
, pero establece un enlace de datos bidireccional entre la vista y el alcance.ng-model-options
ng-repeat
ng-show
&ng-hide
ng-switch
ng-view
El enlace de datos bidireccional de AngularJS tuvo su característica más notable, aliviando en gran medida al servidor backend de las responsabilidades de plantillas. En cambio, las plantillas se representaron en HTML simple según los datos contenidos en un alcance definido en el modelo. El $scope
servicio en Angular detectó cambios en la sección del modelo y modificó expresiones HTML en la vista a través de un controlador. Asimismo, cualquier alteración en la vista quedó reflejada en el modelo. Esto evitó la necesidad de manipular activamente el DOM y fomentó el arranque y la creación rápida de prototipos de aplicaciones web. [13]
AngularJS detectó cambios en los modelos comparando los valores actuales con los valores almacenados anteriormente en un proceso de verificación sucia, a diferencia de Ember.js y Backbone.js que activaron los oyentes cuando se cambiaron los valores del modelo. [14]
$watch
$scope.$watch('person.username', validateUnique);
<input ng-model="person.username" />
$digest
$apply
$destroy
AngularJS fue desarrollado originalmente en 2009 por Miško Hevery [15] en Brat Tech LLC [16] como el software detrás de un servicio de almacenamiento JSON en línea , cuyo precio habría sido por megabyte, para aplicaciones fáciles de crear para la empresa. Esta empresa estaba ubicada en el dominio web "GetAngular.com", [16] y tenía algunos suscriptores, antes de que los dos decidieran abandonar la idea de negocio y lanzar Angular como una biblioteca de código abierto.
La versión 1.6 agregó muchos de los conceptos de Angular a AngularJS, incluido el concepto de arquitectura de aplicación basada en componentes. [17] Esta versión, entre otras, eliminó el Sandbox, que muchos desarrolladores creían que proporcionaba seguridad adicional, a pesar de las numerosas vulnerabilidades que se habían descubierto y que eludían el Sandbox. [18] La versión estable actual (a noviembre de 2023) de AngularJS es 1.8.3 [19]
En enero de 2018, se anunció un cronograma para la eliminación gradual de AngularJS: después del lanzamiento de 1.7.0, el desarrollo activo en AngularJS continuaría hasta el 30 de junio de 2018. Posteriormente, 1.7 fue admitido hasta el 31 de diciembre de 2021 como soporte a largo plazo . [4] [5]
Las versiones 1.3 y posteriores de AngularJS no eran compatibles con Internet Explorer 8 o versiones anteriores. Si bien AngularJS 1.2 era compatible con IE8, su equipo no. [20] [21]
Las versiones posteriores de AngularJS se llaman simplemente Angular . [22] Angular es una reescritura incompatible de AngularJS basada en TypeScript . Angular 4 se anunció el 13 de diciembre de 2016, omitiendo 3 para evitar confusión debido a la desalineación de la versión del paquete del enrutador que ya se distribuyó como v3.3.0. [23]
AngularDart funciona en Dart , que es un lenguaje de programación de herencia única , definido por clases y orientado a objetos que utiliza sintaxis de estilo C , que es diferente de Angular JS (que usa JavaScript ) y Angular 2/Angular 4 (que usa TypeScript ). Angular 4 se lanzó en marzo de 2017, con la versión del marco alineada con el número de versión del enrutador que utilizó. Angular 5 se lanzó el 1 de noviembre de 2017. [24] Las mejoras clave en Angular 5 incluyen soporte para aplicaciones web progresivas, un optimizador de compilación y mejoras relacionadas con Material Design. [25] Angular 6 se lanzó el 3 de mayo de 2018, [26] Angular 7 se lanzó el 18 de octubre de 2018 y Angular 8 se lanzó el 28 de mayo de 2019. Angular sigue los estándares de versiones semánticas, y cada número de versión principal indica cambios potencialmente importantes. . Angular se ha comprometido a brindar 6 meses de soporte activo para cada versión principal seguidos de 12 meses de soporte a largo plazo. Los lanzamientos principales son bianuales con 1 a 3 lanzamientos menores por cada lanzamiento principal. [27]
Una aplicación Angular normal se ejecuta en el navegador, mientras que Angular Universal genera páginas de aplicaciones estáticas en el servidor a través de la representación del lado del servidor (SSR). [28]
AngularJS Material [29] [30] era una biblioteca de componentes de interfaz de usuario que implementaba Material Design en AngularJS. [31] La biblioteca proporcionó un conjunto de componentes de interfaz de usuario reutilizables, bien probados y accesibles . En enero de 2022, la biblioteca cerró, como se anunció en su sitio web oficial. [32] La biblioteca de materiales AngularJS es un producto maduro y estable que está listo para su uso en producción y funciona solo con AngularJS 1.x. La biblioteca Angular Material está disponible en el repositorio angular/material2 de GitHub.
En julio de 2012, el equipo de Angular creó una extensión para el navegador Google Chrome llamada Batarang, [33] que mejoró la experiencia de depuración para aplicaciones web creadas con Angular. La extensión tenía como objetivo permitir una fácil detección de cuellos de botella en el rendimiento y ofrecía una GUI para depurar aplicaciones. [34] Durante un tiempo a finales de 2014 y principios de 2015, la extensión no fue compatible con versiones recientes (después de v1.2.x) de Angular. [35] La última actualización realizada a esta extensión fue el 4 de abril de 2017.
AngularJS estableció el paradigma de un ciclo de resumen . Este ciclo podría considerarse un bucle, durante el cual AngularJS verifica si hubo algún cambio en todas las variables observadas por todos los $scopes
. Si $scope.myVar
está definido en un controlador y esta variable está marcada para observación, Angular monitoreará los cambios en myVar en cada iteración del bucle.
Este enfoque potencialmente condujo a una renderización lenta cuando AngularJS verificaba demasiadas variables en $scope
cada ciclo. Miško Hevery sugirió mantener menos de 2.000 observadores en cualquier página. [14]
AngularJS 1.3 ha dejado de ser compatible con IE8.
Lea más sobre esto en nuestro blog.
AngularJS 1.2 seguirá siendo compatible con IE8, pero el equipo central no planea dedicar tiempo a abordar problemas específicos de IE8 o versiones anteriores.