Show Menu
Cheatography

Angular v7 Snippets Cheat Sheet by

Typescript snippets

a-comp­onent
component
a-comp­one­nt-­inline
component with inline template
a-comp­one­nt-root
root app component
a-dire­ctive
directive
a-guar­d-c­an-­act­ivate
CanAct­ivate guard
a-guar­d-c­an-­act­iva­te-­child
CanAct­iva­teChild guard
a-guar­d-c­an-­dea­ctivate
CanDea­ctivate guard
a-guar­d-c­an-load
CanLoad guard
a-http­cli­ent-get
httpCl­ien­t.get with Rx Observable
a-http­-in­ter­ceptor
Empty Angular HttpIn­ter­ceptor for HttpClient
a-http­-in­ter­cep­tor­-he­aders
Angular HttpIn­ter­ceptor that sets headers for HttpClient
a-http­-in­ter­cep­tor­-lo­gging
Angular HttpIn­ter­ceptor that logs traffic for HttpClient
a-module
module
a-modu­le-root
root app module
a-modu­le-­routing
routing module file (forChild)
a-ngrx­-da­ta-­sto­re-­module
create an NgRx Data store module
a-ngrx­-da­ta-­ent­ity­-me­tadata
create the entity metadata for NgRx
a-ngrx­-da­ta-­ent­ity­-co­lle­cti­on-­dat­a-s­ervice
create a data service using NgRx
a-outp­ut-­event
@Output event and emitter
a-pipe
pipe
a-rxjs­-import
import RxJs features
a-rxjs­-op­erators
import RxJs opertors
a-rout­e-p­ath-404
404 route path
a-rout­e-p­ath­-de­fault
default route path
a-rout­e-p­ath­-wi­th-­chi­ldren
route path with children
a-rout­e-p­ath­-eager
eager route path
a-rout­e-p­ath­-lazy
lazy route path
a-rout­er-­events
listen to one or more router events
a-rout­e-p­ara­ms-­sub­scribe
subscribe to route parameters
a-service
service
a-serv­ice­-ht­tpc­lient
service with HttpClient
a-ctor­-sk­ip-self
angular NgModule's skipself constr­uctor
a-subs­cribe
Rx Observable subscr­iption
 

Html snippets

a-class
[class] binding
a-select
[style] binding
a-ngClass
ngClass
a-ngFor
*ngFor
a-ngFo­rAsync
*ngFor with async
a-ngFo­r-t­rackBy
*ngFor with trackBy
a-form­Con­tro­lName
formCo­ntr­olName
a-form­Group
formGroup
a-form­Gro­upName
formGr­oupName
a-ngIf
*ngIf
a-ngIfElse
*ngIf with else
a-ngModel
ngModel
a-rout­erLink
routerLink
a-rout­erL­ink­-param
routerLink with a route parameter
a-ngStyle
ngStyle
a-ngSwitch
ngSwitch
a-prej
show the JSON form of a model
a-preja
show the JSON form of a model, using async

Javascript snippets

ex-sim­ple­-server
Node.js Express Server

Help Us Go Positive!

We offset our carbon usage with Ecologi. Click the link below to help us!

We offset our carbon footprint via Ecologi
 

Comments

Add a Comment

Your Comment

Please enter your name.

    Please enter your email address

      Please enter your Comment.

          Related Cheat Sheets

          AngularJS Cheat Sheet
          Angular 2 Forms Cheat Sheet