title: Storing jquery/js templates in a separate files
body: <p>I am trying to figure out how to store jQuery templates in different files from the base html (without using a string or ajax request).</p>
  
  <p>For instance, on my html page, I would like to do this:</p>
  
  <pre><code>&lt;script type ="text/x-jquery-tmpl" id="personTmpl" src="js/personApp.tmpl.html"&gt;&lt;/script&gt;
  &lt;div id="container"&gt;&lt;/div&gt;
  &lt;script type="text/javascript"&gt;
      var p = { name: 'joe' };
      $( "#personTmpl" ).tmpl( p ).appendTo( "#container" );
  &lt;/script&gt;
  </code></pre>
  
  <p>Where the #personTmpl would be defined in the personApp.tmpl.html file (or someplace else)</p>
  
  <p>The end goal is just keeping my template separate from the js code (and html).</p>
  
  <p>I don't like the string method, because it makes editing hard for longer templates. And I don't want to fire an ajax request off on load either (note, the template file would eventually be aggregated for production).</p>
  
  <p>Thoughts?</p>