Anjular.js fragment identifier “#” hash issue with SharePoint 2019 Modern UI

OnPrem SharePoint 2019, Modern UI, Horizontal Navigation Bar trimming special characters in our case “#” (Hash) in query strings for link entries which breaks 3^rd Party Angular.js navigation.
like: http://www.contoso.com/home.aspx/?#/banner/yellow

(Btw:This issue is not present on SharePoint Online)

This issue only happens with SharePoint 2019 Modern UI and if you store your links with Vertical or Horizontal Navigation OOB control.

The reason is OOB Modern UI Navigation components trims any fancy character including hashes (#) where it is required for your angular.js custom solution navigation or routing purpose.

For resolution; you may try following workarounds:

There are several articles in related Angular design and how it may change this behavior.

• • • https://stackoverflow.com/questions/14771091/removing-the-fragment-identifier-from-angularjs-urls-symbol
    • https://www.c-sharpcorner.com/article/how-to-remove-hash-from-application-url-in-angularjs/
    • http://joeljoseph.net/angularjs-remove-hash-from-url/

There are always some issues we are expecting integrating 3^rd party tools with SharePoint. We are trying to support as much as possible 3^rd party JS library usage with SharePoint like Angular.js, but we don’t have support for Angular.js itself. It is an open source project that we cannot help much to removing “#” on Angular.js for angular navigation. This is out of scope for Microsft Support.

Luckily, Microsoft SharePoint product group fixed that behaviour and the resolution has been addressed with November CU 2019 for SharePoint Server 2019.

November 2019 CU for SharePoint Server 2019 is available for download