 <p>There are two main problems with your code:</p> <ol> <li>Enable HTML 5 mode for <a href="https://docs.angularjs.org/api/ng/provider/$locationProvider" rel="nofollow">pushState via $locationProvider</a> for URLs like <code>/dashboard</code> and <code>/page_3</code></li> <li>Fix the problem where route is configured for <code>/page_3</code> but having a <code>a</code> tag pointed to <code>/page_3.html</code></li> </ol> <p>To get a working example:</p> <ul> <li><p>Add a base tag</p> <pre><code>&lt;base href="/"&gt; </code></pre></li> <li><p>Enable html5 mode via locationProvider in a <a href="https://docs.angularjs.org/guide/providers" rel="nofollow">config</a> block</p> <pre><code>$locationProvider.html5Mode(true); </code></pre></li> <li><p>Fix route in dashboard.html</p> <pre><code> &lt;!-- below is dashboard.html page --&gt; &lt;div ng-controller="app"&gt; &lt;h1&gt;Page_3&lt;/h1&gt; &lt;div&gt;&lt;a href='page_3.html'&gt;page_3&lt;/a&gt;&lt;/div&gt; &lt;/div&gt; </code></pre></li> </ul> <p><a href="http://jsbin.com/vakujokara" rel="nofollow">Click here for the demo / jsbin.</a></p> <p>Other/suggestions: as <a href="http://stackoverflow.com/users/1462603/zach-briggs">Zack Briggs</a> have suggested; using controller syntax in routes would help you come up with better code structure / design in router config, <a href="https://docs.angularjs.org/api/ng/service/$compile" rel="nofollow">directives</a>, or <a href="https://docs.angularjs.org/guide/component" rel="nofollow">components</a>. Also putting everything in one place is often a bad idea for a growing project.</p>