Getting started with Angular 2


Angular 2 Model:

NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule
  ],
  providers: []
})
export class AppModule { }

Angular 2 Component:

Component({
  template : `<div>Welcome to profistart Angular for Beginner</div>`
})

Angular 2 init Model:

platformBrowserDynamic().bootstrapModule(AppModule);


Angular 2 init Event Listener:

Component({
    selector: 'profistart-root',
    template: 
	`<textfield 
    (keyup)="onKeyUp()"
    (textfield)="color=$event.target.value"
    [style.background-color]="color">`
})
export class AppComponent {
    public color: string;
    onKeyUp() {
        console.log('keyup: ' +         
        this.color)
    }
}

Angular 2 Directive:

Component({
    selector: 'profistart-root',
    template : 
     `<textfield´ [(ngModel)]="content" >
     <p>content</p>`
})
export class AppComponent {}

Angular 2 Connect Model View:

Component({
    selector: 'profistart-root',
    template: 
    `Hallo i am a component`
})

Angular 2 Selector:

<div class="container">
<profistart-root>
</profistart-root>
</div>

More Examples: stackoverflow.com/questions/38103920/how-to-use-javascript-functions-in-an-angular-2-component-from-a-different-file

MORE SUPPORT