Jesus' edits

Author: Foxandxss

public/docs/_examples/cb-jquery-plugin/ts/app/app.component.ts

@@ -1,7 +1,5 @@
 // #docregion
-import { Component }               from  '@angular/core';
-import { HeroAssignmentComponent } from './hero-assignment.component';
-import { HeroComponent }           from  './hero.component';
+import { Component } from  '@angular/core';
 
 @Component({
   selector: 'my-app',
@@ -17,8 +15,7 @@ import { HeroComponent }           from  './hero.component';
         </div>
       </div>
     </div>
-  `,
-  directives: [HeroAssignmentComponent, HeroComponent]
+  `
 })
 export class AppComponent {
   heroes = ['Mr. Nice',
@@ -30,7 +27,7 @@ export class AppComponent {
                  'Rescue village from dragon(s)',
                  'Rescue princess from tower'];
 
-  removeHero(heroToRemove: string) {
+  removeHero(heroToRemove: string): void {
     this.heroes = this.heroes.filter(hero => hero !== heroToRemove);
   }
 }

public/docs/_examples/cb-jquery-plugin/ts/app/app.module.ts

@@ -0,0 +1,13 @@
+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+
+import { AppComponent } from './app.component';
+import { HeroAssignmentComponent } from './hero-assignment.component';
+import { HeroComponent } from './hero.component';
+
+@NgModule({
+  imports: [ BrowserModule ],
+  declarations: [ AppComponent, HeroAssignmentComponent, HeroComponent ],
+  bootstrap: [ AppComponent ]
+})
+export class AppModule {}

public/docs/_examples/cb-jquery-plugin/ts/app/hero-assignment.component.html

@@ -2,6 +2,6 @@
 <div #assignment class="assignment" [ngClass]="{selected: heroDropped}">
     <div>{{title}}</div>
     <ul>
-      <li *ngFor="let hero of assignedHeroes">{{hero}}</li>                    
+      <li *ngFor="let hero of assignedHeroes">{{hero}}</li>
     </ul>
 </div>

public/docs/_examples/cb-jquery-plugin/ts/app/hero-assignment.component.ts

@@ -14,7 +14,7 @@ export class HeroAssignmentComponent implements AfterViewInit {
   assignedHeroes: string[] = [];
 
   // #docregion add-plugin
-  ngAfterViewInit() {
+  ngAfterViewInit(): void {
     jQuery(this.assignment.nativeElement).droppable({drop : (event: any, ui: any) => {
       let heroName = ui.draggable.data('hero');
       if (this.assignedHeroes.indexOf(heroName) === -1) {

public/docs/_examples/cb-jquery-plugin/ts/app/hero.component.html

@@ -1,5 +1,5 @@
 <!-- #docregion -->
 <div #hero class="hero" [attr.data-hero]="name">
   {{name}}
-  <div><button (click)="done()">Done</button></div>        
+  <div><button (click)="done()">Done</button></div>
 </div>

public/docs/_examples/cb-jquery-plugin/ts/app/hero.component.ts

@@ -10,16 +10,16 @@ declare var jQuery: any;
 })
 export class HeroComponent implements AfterViewInit {
   @Input() name: string;
-  @Output() remove: EventEmitter<string> = new EventEmitter<string>();
+  @Output() remove = new EventEmitter<string>();
   @ViewChild('hero') hero: ElementRef;
 
   // #docregion add-plugin
-  ngAfterViewInit() {
+  ngAfterViewInit(): void {
     jQuery(this.hero.nativeElement).draggable({revert: 'invalid'});
   }
   // #enddocregion add-plugin
 
-  done() {
+  done(): void {
     this.remove.emit(this.name);
   }
 }

public/docs/_examples/cb-jquery-plugin/ts/app/main.ts

@@ -1,6 +1,5 @@
-import { bootstrap }    from '@angular/platform-browser-dynamic';
+import { platformBrowserDynamic }    from '@angular/platform-browser-dynamic';
 
-import { AppComponent } from './app.component';
+import { AppModule } from './app.module';
 
-bootstrap(AppComponent, [])
-  .catch((err: any) => console.error(err));
+platformBrowserDynamic().bootstrapModule(AppModule);