<p dir="auto">I am trying the 'hero' example on angular.io and using JSPM to load my scripts (non-bundled).<br>
To get relative urls for my templates, i tried the method in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="85639418" data-permission-text="Title is private" data-url="https://github.com/angular/angular/issues/2383" data-hovercard-type="issue" data-hovercard-url="/angular/angular/issues/2383/hovercard" href="https://github.com/angular/angular/issues/2383">#2383</a> and added <code class="notranslate">moduleId: module.id</code> to my component.</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="import {Component} from 'angular2/core';
import {Hero} from &quot;./hero&quot;;

@Component({
    selector: 'my-hero-detail',
    inputs: ['hero'],
    moduleId: module.id,
    templateUrl:'heroes.html'
})"><pre class="notranslate"><code class="notranslate">import {Component} from 'angular2/core';
import {Hero} from "./hero";

@Component({
    selector: 'my-hero-detail',
    inputs: ['hero'],
    moduleId: module.id,
    templateUrl:'heroes.html'
})
</code></pre></div>
<p dir="auto">However, doing so and then running the app, makes the html stuck at 'Loading...' with no errors in the console.</p>
<p dir="auto">Screenshot:<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://cloud.githubusercontent.com/assets/3190176/12008390/1caf5b36-abec-11e5-90df-f4b07bd1e39e.png"><img width="232" alt="angular_2_quickstart" src="https://cloud.githubusercontent.com/assets/3190176/12008390/1caf5b36-abec-11e5-90df-f4b07bd1e39e.png" style="max-width: 100%;"></a></p>
<p dir="auto">As mention on <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="85639418" data-permission-text="Title is private" data-url="https://github.com/angular/angular/issues/2383" data-hovercard-type="issue" data-hovercard-url="/angular/angular/issues/2383/hovercard" href="https://github.com/angular/angular/issues/2383">#2383</a> we could use Relative TemplateUrl just setting the property "module" inside component decoration.</p>
<p dir="auto">Actually we are unable to use this feature because we use systemjs as described in "5 Min Quickstart - ts" sample....so we don't have any "module.id" set by the loader.</p>
<p dir="auto">The question is just simple...how to use Relative TemplateUrl with SystemJS?</p>