title: Angular UI Router - Dynamic TemplateURL
body: <p>I am building a static HTML website with angular UI router for navigation. I basically have one ui-view with multiple (10+) html templates (pages) to load into that view. All my template pages are in a directory called 'pages'.</p>
  
  <p>So i basically want to know if we can define just one state in the $stateProvider to assign multiple template urls dynamically instead of writing different states for each HTML template page (like mentioned below).</p>
  
  <pre><code>$stateProvider
  .state('home', {
      url: '/home',
      templateUrl: 'pages/home.html',
      controller: 'homeController',
      controllerAs: 'home'
  })
  .state('viz', {
      url: '/viz',
      templateUrl: 'pages/viz.html',
      controller: 'vizController',
      controllerAs: 'viz'
  })
  .state('about', {
      url: '/about',
      templateUrl: 'pages/about.html',
      controller: 'aboutController',
      controllerAs: 'about'
  })....
  </code></pre>
  
  <p>Any help is much appreciated.</p>