Angular 7 | Componentes

Los componentes en angular son similares a las páginas de un sitio web. Los componentes son una característica clave en angular. Están bien optimizados en comparación con las páginas porque son ligeros y reutilizables por naturaleza. 

Creando un Componente en angular 7:

Para crear un componente en cualquier aplicación angular, el primer paso es ingresar al directorio de la aplicación y luego crear un nuevo componente mediante el comando ng en el shell. 

La sintaxis es: 

Los comandos se escriben como: 
 

cd app
ng generate component comp1


 

cd app
ng g c comp1

Después de la ejecución del comando, se formará una nueva carpeta dentro de la carpeta de la aplicación con el nombre del componente. 
 

Estructura de un nuevo componente

Cada nuevo componente cuando se crea consta de 4 archivos enumerados a continuación (considerando comp1 como el nombre del componente): 
 

  1. comp1/comp1.component.html: este archivo consiste en el código HTML de cómo se verá el componente.
  2. comp1/comp1.component.spec.ts: el archivo está escrito a máquina y se utiliza con fines de prueba. La presencia de este archivo no es necesaria.
  3. comp1/comp1.component.ts: este archivo consiste en la clase de componente en formato TypeScript con el nombre Comp1Component que implementa la interfaz OnInit y tiene un método ngOnInit() por defecto. El código escrito dentro de este método se ejecuta cuando el estado del ciclo de vida de la página es Init.
  4. comp1/comp1.component.css: este archivo tiene el CSS vinculado al archivo HTML que se muestra arriba.

Publicación traducida automáticamente

Artículo escrito por piyush25pv y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *