Link with href to id on page not including route data - html

Question

Generating documentation in an ASP.NET Core MVC app. The view renders headings with ids and the contents of other sections needs to link to them.
Example view:
#foreach (MyObject thing in Model)
{
<h5 id="#thing.Name">#thing.Name</h5>
<h6>List</h6>
#foreach (MySubObject otherThing in thing.SubObjects)
{
<div class="row">
<div class="col-md-4 col-sm-6">#otherThing.Name</div>
<div class="col-md-4 col-sm-6">
#if (otherThing.HasParent)
{
<a href="#($"#{otherThing.ParentName}")">
#otherThing.ParentName
</a>
}
</div>
</div>
}
}
This generates exactly what I want it to:
<div class="row">
<div class="col-md-4 col-sm-6">OtherThing7Name</div>
<div class="col-md-4 col-sm-6">
<a href="#ParentName">
ParentName
</a>
</div>
</div>
...
<h5 id="ParentName">ParentName</h5>
But the link, when I hover over it, goes to http://localhost/#ParentName instead of preserving the route data e.g. http://localhost/Documentation/Things#ParentName, so instead of just jumping to that location on the page, it takes it to the root of the application.
Update:
Okay, it looks like this is happening because <base href="~/" /> is defined in the View Layout being used (which all Views in the application use). Removing it allowed the link to work as expected, but I don't know what effects it would have on the rest of the site.