title: Beginner Angularjs UI Routing
body: <p>I have began learning AngularJS and decided to go with Angular-UI-Router for all of my routing needs, but unfortunately, I am unable to get the templateURL property of the $stateProvider to render. I have followed tutorials to the world's end, and cannot get templateURL to work (even when following the tutorial). Am I missing something? </p>
  
  <p>All of the following documents are located within the same directory. I am opening the webpage directly in Chrome (I am not combining with node/express or any other service).</p>
  
  <p><strong>index.html</strong></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.10/angular-ui-router.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="app.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body ng-app="app"&gt;
  
  &lt;nav&gt;
  &lt;a ui-sref="home"&gt;Home&lt;/a&gt;
  &lt;a ui-sref="about"&gt;About&lt;/a&gt;
  &lt;/nav&gt;
  
  &lt;div ui-view&gt;&lt;/div&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>app.js</strong></p>
  
  <pre><code>var app = angular.module('app', ['ui.router']).
  
  config(['$stateProvider', '$urlRouterProvider', 
      function($stateProvider, $urlRouterProvider) {
  
      $urlRouterProvider.otherwise('/');
  
      $stateProvider
  
          .state('home', {url: '/home', template: '&lt;h1&gt;HOME&lt;/h1&gt;'})
          .state('about', {url: '/about', templateURL: 'about.html'});
  
  }]);
  </code></pre>
  
  <p><strong>about.html</strong></p>
  
  <pre><code>&lt;div&gt;&lt;p&gt;About&lt;/p&gt;&lt;/div&gt;
  </code></pre>