Crear Component Angular

Comando para crear nuevo componente: 

    ng generate component NOMBRE-COMPONENTE

Comando de forma abreviada: 

    ng g c NOMBRE-COMPONENTE

En el terminal:

     Ir a Terminal >> New Terminal >> Command Prompt

C:\Angular\primo-progetto>ng generate component NOMBRE-COMPONENT

Automáticamente se creara el componente con sus respectivos file, con sus importaciones

Agregar componente de forma manual:

Clic derecho en app >> new folder >>  escribir NOMBRE-COMPONENTE

Agregar el nombre del componente >> Luego dentro de la carpeta crear los nuevos file a utilizar:

Clic derecho en la carpeta creada con el nombre del componente >> new file  >> NOMBRE-COMPONENTE

Al definir el nombre del componente en el file, debe ser escrito con su respectiva extensión:

• NOMBRE-COMPONENTE.component.css
• NOMBRE-COMPONENTE.component.html
• NOMBRE-COMPONENTE.component.ts

En el NOMBRE-COMPONENTE.component.css: en este archivo se podrá dar estilo al componente

Ejemplo:

.color{

    color: red;

}

En el NOMBRE-COMPONENTE.component.html: en este archivo se escribirán los código html para crear el template

Ejemplo:

    <p class="color">NOMBRE-COMPONENTE works!</p>

En el NOMBRE-COMPONENTE.component.ts:

import { Component, OnInit } from '@angular/core';

    @Component({

        selector: 'app-NOMBRE-COMPONENTE',
    templateUrl: './NOMBRE-COMPONENTE.component.html',
    styleUrls: ['./NOMBRE-COMPONENTE.component.css']
       })

    export class NOMBRECOMPONENTEComponent {

        constructor() { }
    }

Por ultimo agregar manualmente las importaciones:

En el app.module.ts:

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { NOMBRECOMPONENTEComponent } from './NOMBRE-COMPONENTE/NOMBRE-COMPONENTE.component';

@NgModule({
    declarations: [
    AppComponent,
    NOMBRECOMPONENTEComponent,
    ],

imports: [
    BrowserModule
],
providers: [],
    bootstrap: [AppComponent]
})
    export class AppModule { }