Angular

Angular Samples

Home

1. Create New Component
2. Component To HTML
3. @Input
4. Button Click Event
5. @Output
6. Template Variable
7. *ngFor
8. Safe Navigation Operator
9. *ngIf
10. Hidden Property
11. *ngSwitch
12. Service
13. Routing
14. Routing with Parameter
15. Router Link
16. Module
17. Lazy Loaded Module

Create New Component

ng g c MyFirstComponent

If we have child module then we need to move import from app.module.ts to childmodule.module.ts

app.module.ts

import { MyFirstComponentComponent } from './my-first-component/my-first-component.component';

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

	imports: [
		BrowserModule
	],

	providers: [],

	bootstrap: [AppComponent]
})

export class AppModule { }

my-first-component.component.ts

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

@Component({
	
	selector: 'app-my-first-component',
	templateUrl: './my-first-component.component.html',
	styleUrls: ['./my-first-component.component.css']
})

export class MyFirstComponentComponent implements OnInit {

	constructor() { }


	ngOnInit() {
	}

}