Hi Here the correct way to resolve this issue of template binding.
app.component.ts:
import { Component } from 'angular2/core';
import { RouteConfig, ROUTER_DIRECTIVES } from 'angular2/router';
import { HomeComponent} from './ HomeComponent';
@Component({
selector: 'my-app',
template: `
<router-outlet>
`,
directives: [ROUTER_DIRECTIVES]
})
@RouteConfig([
{ path: '/Home', name: 'Home', component: HomeComponent, useAsDefault: true },
])
export class AppComponent { }
home.component.ts :
import { Component } from 'angular2/core';
import { ROUTER_DIRECTIVES } from 'angular2/router';
import { HTTP_PROVIDERS, Http } from 'angular2/http';
import { AppComponent } from './app.component';
import { Router } from 'angular2/router';
@Component({
selector: home,
templateUrl: home/home.component.html,
directives: [ROUTER_DIRECTIVES],
providers: [HTTP_PROVIDERS]
})
export class HomeComponent{}
Try this and let me know