Componentes en Angular 8

El componente es el componente básico de Angular. Tiene un selector, una plantilla, un estilo y otras propiedades, y especifica los metadatos necesarios para procesar el componente. 

Creando un Componente en Angular 8:

Para crear un componente en cualquier aplicación angular, siga los pasos a continuación:

  • Acceda a la aplicación angular a través de su terminal.
  • Cree un componente usando el siguiente comando:
ng g c <component_name> 
OR
ng generate component <component_name> 
  • Los siguientes archivos se crearán después de generar el componente:

Usando un componente en Angular 8:

  • Vaya al archivo component.html y escriba el código HTML necesario.
  • Vaya al archivo component.css y escriba el código CSS necesario.
  • Escriba el código correspondiente en el archivo component.ts.
  • Ejecute la aplicación Angular usando ng serve –open

Código de implementación: tenga en cuenta que el nombre del componente en el siguiente código es componente gfg.

gfg.componente.html:

<h1>GeeksforGeeks</h1>

gfg.componente.css:

h1{
    color: green;
    font-size: 30px;
}

gfg.component.ts:

import { Component, OnInit } from '@angular/core';
  
@Component({
  selector: 'app-gfg',
  templateUrl: './gfg.component.html',
  styleUrls: ['./gfg.component.css']
})
export class GfgComponent{
    a ="GeeksforGeeks";
}

aplicación.módulo.ts:

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
  
import { AppComponent } from './app.component';
import { GfgComponent } from './gfg/gfg.component';
   
   
@NgModule({
  imports:      [ BrowserModule ],
  declarations: [ AppComponent, GfgComponent ],
  bootstrap:    [ AppComponent ]
})
export class AppModule { }

Producción:

Publicación traducida automáticamente

Artículo escrito por agamjyot08 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 *