Angular es una plataforma y un framework para crear aplicaciones de una sola página en el lado del cliente usando HTML y TypeScript. Angular está escrito en TypeScript. Implementa la funcionalidad básica y opcional como un conjunto de bibliotecas TypeScript que importas en tus aplicaciones.
La arquitectura de una aplicación en Angular se basa en ciertos conceptos fundamentales. Los bloques de construcción básicos son los NgModules, que proporcionan un contexto de compilación para los componentes. Los NgModules recopilan código relacionado en conjuntos funcionales; una aplicación de Angular se define por un conjunto de NgModules. Una aplicación siempre tiene al menos un módulo raíz que permite el arranque y generalmente tiene muchos más módulos de funcionalidad.
- Los componentes definen vistas, que son conjuntos de elementos de la pantalla que Angular puede elegir y modificar de acuerdo con la lógica y los datos de tu programa.
- Los componentes usan servicios, los cuales proporcionan una funcionalidad específica que no está directamente relacionada con las vistas. Los proveedores de servicios pueden inyectarse en componentes como dependencias, haciendo que tu código sea modular, reutilizable y eficiente.
Los módulos, componentes y servicios son clases que usan decoradores. Estos decoradores indican su tipo y proporcionan metadatos que le indican a Angular cómo usarlos.
- Los metadatos para una clase servicio proporcionan la información que Angular necesita para que esté disponible para los componentes a través de la Inyección de Dependencia (ID).
- Los metadatos para una clase servicio proporcionan la información que Angular necesita para que esté disponible para los componentes a través de la Inyección de Dependencia (ID).
Módulos
Los NgModules de Angular difieren y complementan los módulos JavaScript (ES2015). Un NgModule declara un contexto de compilación para un conjunto de componentes que está dedicado a un dominio de aplicación, un flujo de trabajo o un conjunto de capacidades estrechamente relacionadas. Un NgModule puede asociar sus componentes con código relacionado, como servicios, para formar unidades funcionales.
Cada aplicación en Angular tiene un módulo raíz, convencionalmente nombrado AppModule, que proporciona el mecanismo de arranque que inicia la aplicación. Una aplicación generalmente contiene muchos módulos funcionales.
Como en los módulos de JavaScript, los NgModules pueden importar la funcionalidad de otros, y permiten que su propia funcionalidad sea exportada y utilizada por otros NgModules. Por ejemplo, para utilizar el servicio de enrutamiento en su aplicación, importa el NgModule Router.
Organizar tu código en distintos módulos funcionales ayuda a gestionar el desarrollo de aplicaciones complejas, y en el diseño para su reutilización. Además, esta técnica te permite aprovechar la carga diferida—es decir, cargar módulos bajo demanda—para minimizar la cantidad de código que debe cargarse al inicio.
Componentes
Cada aplicación de Angular tiene al menos un componente, el componente raíz que conecta una jerarquía de componentes con el modelo de objetos del documento de la página (DOM). Cada componente define una clase que contiene datos y lógica de la aplicación, y está asociado con una plantilla HTML que define una vista que se mostrará en un entorno de destino. El decorador @Component() identifica la clase inmediatamente debajo de ella como un componente, y proporciona la plantilla y los metadatos específicos del componente relacionado.
Una plantilla combina HTML con markup de Angular que puede modificar elementos HTML antes de que se muestren. Las directivas de la plantilla proporcionan la lógica de programa y el enlace markup conecta los datos de tu aplicación y el DOM. Hay dos tipos de enlace de datos:
- Manejador de eventos permite que tu aplicación responda a la entrada del usuario en el entorno objetivo actualizando los datos de tu aplicación.
-Vincular propiedades te permite interpolar valores que se calculan a partir de los datos de tu aplicación en HTML.