Saltar al contenido

componentes angulares tutorialDec, 26thIn este tutorial, vamos a aprender acerca de lo que es un componente y …

marzo 13, 2020

 

En este tutorial, vamos a aprender acerca de lo que es un componente y cómo crear nuevos componentes inangular.

Nota: En el último tutorial, hemos creado nuestro Proyecto angular utilizando CLI

Qué es un componente?

Un componente es una pieza reutilizable de la interfaz de usuario donde podemos crear una vez y la reutilización a través de nuestra aplicación.

Tienes que ver en la imagen de cabecera arriba y entradas del blog son dos componentes diferentes combinados de construir esta página de índice.

Crear el componente angular

Este tutorial se supone que ya ha creado un nuevo proyecto angular utilizando angular-cli.

Una vez que ha creado con éxito un proyecto angular continuación, abra su proyecto usando su editor de código favorito.

ya se puede ver carpeta de aplicación en el directorio src estos es el lugar donde creamos nuevos componentes por defecto que podemos obtener la raíz componente angular llamados app.component.ts.

Para crear una necesidad que los componentes para crear una nueva carpeta con el nombre del componente dentro de la carpeta de aplicaciones.

Vamos a crear una nueva carpeta llamada cabecera dentro de la carpeta de aplicaciones.

Cada componente angular contiene tres archivos que son html, css y Ts.

.html: contiene el código HTML relacionada con ese componente.

Css: Contiene el código relacionado con el peinado.

.TS: Es un fichero de transcripción que contiene la lógica de componentes.

Nota: usos angular del texto mecanografiado que es un superconjunto del Javascript si usted no sabe acerca de mecanografiado entonces echa un vistazo a mi mecanografiado principiantes tutorial.

Vamos a crear un nuevo archivo llamado header.component.html dentro de la carpeta de cabecera y añadir el siguiente código.