Angular2 Cheat Sheet Cheat Sheet (DRAFT) by MonicaAngular

OBSERV­ABL­ESwork with multiple values over time cancel­lable support map, filter, reduce and similar operators use Reactive Extensions (RxJS) an array whose items arrive asynch­ron­ously over time
emits a single value, .
PROMISES return a single value not cancel­lable more readable code with try/catch and async/­await

Pipes
are a good way to format strings, currency amounts, dates and other display data.
Services
Services are a great way to share inform­ation among classes that don't know each other.

Router­Outlet is one of the router directives that became available to the AppCom­ponent because AppModule imports AppRou­tin­gModule which exported Router­Module.
Add a navigation link (route­rLink)
/ABSOL­UTEPATH
RELATIVE PATH
add a parame­terized route
(:) in the path indicates that :id is a placeh­older for a specific hero id.

HTTP
data persis­tence features with help from Angular's HttpCl­ient.
The HeroSe­rvice gets hero data with HTTP requests.
Users can add, edit, and delete heroes and save these changes over HTTP.
Users can search for heroes by name.
commun­icating with a remote server over HTTP.

Property binding –[]
{{}}
Event Binding –()
For forms keypress use – (input­)=m­ethod
Two-way binding – [(holds comp value)]
When ngModel is used.. import formMo­dules in app.module
After import add modules in import section
Name and ngModel must be used tog

change the behavior or appearance of an element in our template from our component class

@ViewChild because we have only a single instance of it, but we have multiple todo items, so for them we need to apply the @ViewC­hildren decorator.

Directives are for attribute. Giving power to element..
Structural – changes dom
*ngIf. Else name.. renders only inside­<ng­-te­mplate #name(­ref­ere­nce­)> </n­g-t­emp­lat­e>
*ngFor | let i=index; let f=first;
Unstru­ctural
[ngClass] = “{‘cla­ssn­ame’: condit­ion}” | method­name()
[ngStyle]= “{‘prop value’: condition ?
‘value’ : ’value’}”

Inside element use <ng­-co­nte­nt>

Local Reference -> get all info from html ele.
#anyname to the ele.