get started

Angular CLI init

This command will install the Angular CLI
npm install -g @angular/cli

---

Setup a new Angular application
ng new <application name>

---

All available Angular command list
ng new --help

---

Checks application for any linting warnings
ng lint <application name>

---

Fix linting errors.
ng lint <application name> --fix

---

Formats our entire codebase
ng lint <application name> --format stylish

---

Download new dependencies and update the project.
ng add <package name>

---

Angular CLI generate

Create a new component on our application.
ng generate component <name> / ng g c <name>

---

Create a new directive on our application.
ng generate directive <name> / ng g d <name>

---

Creates a new class based service.
ng generate service <name> / ng g s <name>

---

Creates a new pipe.
ng generate pipe <name> / ng g p <name>

---

Creates a new class in the specified
ng generate class <name> / ng g c <destination>

---

Builds application for production in dist directory.
ng build

---

Serves the application and open in a browser.
ng serve -o

---

Serves the application using ssl.
ng serve -ssl

Angular Lifecycle Hooks

// Called whenever one of input properties change.
ngOnChanges() - `before ngOnInit()`

// Called once after ngOnChanges is completed.
ngOnInit() - `after the first ngOnChanges()`

// Whenever a change detection is ran.
ngDoCheck() - `after ngOnChanges()`

// After performs any content projection into view.
ngAfterContentInit() - `after ngDoCheck()`

// After checks the content projected
// into the directive or component.
ngAfterContentChecked()
 - `after ngAfterContentInit()`

// When component’s view has been fully initialized
ngAfterViewInit()
 - `once after ngAfterContentChecked()`

// view of the given component has been checked
// by the change detection.
ngAfterViewChecked()
 - `after ngAfterContentChecked()`

// Before angular destroys a directive or component
ngOnDestroy()

Reference: Lifecycle hooks