How to solve the problem of passing ID as name of file to be loaded as ID.html?

Question

I have a lot of html pages, and decided to use their names (which are short and unique) as id, so when i want click to one row of table, the id (which is the name of file) is passed to templateURL. For example,

app.config(function($routeProvider) {
    $routeProvider
    .when("/post/:id",
    {
        title: 'Disease',
        templateUrl : "/pages/posts/:id.html"
    })

For example, i have Treponema.html, HeartDisease.html, LungCancer.html etc in a list. When I click one, it should show its content on the right side of page, on which i have declared:

<div ng-view></div>

And when i click one listed item, i will take their id as the name (HearDisease, LungCancer) and put it in templateUrl.

<div id="HeartDisease" 
    onclick="window.location.href ='/post/'+this.id+'.html';>

     <p>HeartDisease.html</p>

</div>

Answer 1

I think that the more appropriate for your use case will be to use ng-include. Look at the bottom of the page you have an example.

If you want to update the route in browser you can do it in your controller using the $location object.