Angularjs 2.0 does not load templateUrl

Question

I'm new to Angularjs-2.0. I created a sample application and have a problem downloading templateUrl.

My app.ts file :

import {bootstrap, Component} from 'angular2/angular2';
@Component({
    selector: 'my-app',
    templateUrl: 'grid.html'
})
class AppComponent { }
bootstrap(AppComponent);

I am changing the way, like ./grid.html, but it also does not work for me.

Someone help me ..!

Answer 1

If your directory structure looks like this:

|- app
   |- grid.html
   |- component.ts
   myApp.ts

Then use templateUrl: 'app/grid.html'.

Update

The above solution makes us hard code app/in every place to include these files. So here is another one:

• Define "module": "commonjs"in filetsconfig.json
• Add a new line moduleId: module.id,to the decorator @Component.

So it will be:

@Component({
    selector: 'my-app',
    moduleId: module.id,
    templateUrl: 'grid.html'
})

Link:

• Angular templateUrl
• Angular2 templateUrl styleUrls