Handling dynamic Routes with Diff2Html from its file list in Angular

Question

I am using Diff2Html-UI it with Angular 13 and I am struggling with the links (href) in the file list. Since they have by default this form: <a href="**#d2h-953324**" class="d2h-file-name">somefile.xml</a> As one can see in the code (github link) those are generated via hash from the filename. And since I do not know the routes a developtime I have no way of including them in my routing module.

HTML

<div>
    <span>{{comparisonInfo}}</span><br>
    <div id="diffElement"></div>
</div>

TypeScript

import {Diff2HtmlUI, Diff2HtmlUIConfig} from 'diff2html/lib/ui/js/diff2html-ui-slim.js';
...
let diff = "unified diff string from git fetched by a rest call"
const targetElement = document.getElementById('diffElement');
const configuration : Diff2HtmlUIConfig = {
   drawFileList: this.fileSummary,
   matching: 'lines',
   highlight: true
};
const diff2htmlUi = new Diff2HtmlUI(targetElement, diff, configuration);
diff2htmlUi.draw();
diff2htmlUi.highlightCode();

I have changed the LocationStrategy to: { provide: LocationStrategy, useClass: HashLocationStrategy } but that of course leads to a 404 Page not found.

I was trying to change the file-summary-template to add a basepath, but I couldn't get it to work. To be honest I am not that good in angular to translate the suggestion in one of the tests into something workable in angular. I would like to avoid adding another dependency like hogan.js for this.

Link to the test

Is this the right path to go? Has anyone experienced similar issues?