Angular 2 Cheat Sheet

This is not the complete cheat sheet of all the things, but I think these are very useful snippets for anyone who is beginner.

Inline template:

"<h1>{{ pageTitle }}</h1>"

Inline template:

template: `
{{ pageTitle }}
My First Component

</div> `

Linked Template:


When binding should be used?



Property Binding:

<img [src]='product.imageUrl'>

Event Binding:

<button (click)='toggleImage()'>

Two Way Binding:

<input [(ngModel)]="listFilter'/>

How to build a simple application:

import { Component } from 'angular2/core';

    selector: 'selector-name',
    templateUrl: 'app/something-something.component.html'
export class ProductListComponent {
 pageTitle: string = 'Hello World!';




By Tony Mamedbekov

I am a full stack developer and problem solver, find me on twitter @tmamedbekov

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.