Simplify Angular 2 template where possible

Author: SteveSandersonMS

templates/Angular2Spa/ClientApp/app/app.module.ts

@@ -0,0 +1,31 @@
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { UniversalModule } from 'angular2-universal';
+import { AppComponent } from './components/app/app.component'
+import { NavMenuComponent } from './components/navmenu/navmenu.component';
+import { HomeComponent } from './components/home/home.component';
+import { FetchDataComponent } from './components/fetchdata/fetchdata.component';
+import { CounterComponent } from './components/counter/counter.component';
+
+@NgModule({
+ bootstrap: [ AppComponent ],
+ declarations: [
+ AppComponent,
+ NavMenuComponent,
+ CounterComponent,
+ FetchDataComponent,
+ HomeComponent
+ ],
+ imports: [
+ UniversalModule,
+ RouterModule.forRoot([
+ { path: '', redirectTo: 'home', pathMatch: 'full' },
+ { path: 'home', component: HomeComponent },
+ { path: 'counter', component: CounterComponent },
+ { path: 'fetch-data', component: FetchDataComponent },
+ { path: '**', redirectTo: 'home' }
+ ])
+ ]
+})
+export class AppModule {
+}

templates/Angular2Spa/ClientApp/components/app/app.html renamed to templates/Angular2Spa/ClientApp/app/components/app/app.component.html

@@ -0,0 +1,8 @@
+import { Component } from '@angular/core';
+
+@Component({
+ selector: 'app',
+ template: require('./app.component.html')
+})
+export class AppComponent {
+}

templates/Angular2Spa/ClientApp/app/components/app/app.component.ts

@@ -2,9 +2,9 @@ import { Component } from '@angular/core';
 
 @Component({
  selector: 'counter',
- template: require('./counter.html')
+ template: require('./counter.component.html')
 })
-export class Counter {
+export class CounterComponent {
  public currentCount = 0;
 
  public incrementCounter() {

templates/Angular2Spa/ClientApp/components/counter/counter.html renamed to templates/Angular2Spa/ClientApp/app/components/counter/counter.component.html

@@ -2,10 +2,10 @@ import { Component } from '@angular/core';
 import { Http } from '@angular/http';
 
 @Component({
- selector: 'fetch-data',
- template: require('./fetch-data.html')
+ selector: 'fetchdata',
+ template: require('./fetchdata.component.html')
 })
-export class FetchData {
+export class FetchDataComponent {
  public forecasts: WeatherForecast[];
 
  constructor(http: Http) {

templates/Angular2Spa/ClientApp/components/counter/counter.ts renamed to templates/Angular2Spa/ClientApp/app/components/counter/counter.component.ts

@@ -0,0 +1,8 @@
+import { Component } from '@angular/core';
+
+@Component({
+ selector: 'home',
+ template: require('./home.component.html')
+})
+export class HomeComponent {
+}