In Angular, the "#" symbol is used by default in the URLs for routing. This is known as the "hash-based routing" strategy. To remove the "#" symbol, you can use the "HTML5 pushState" strategy instead.
To configure your Angular app to use the HTML5 pushState strategy, you'll need to update your app's routing module. Here's an example of how to do this:

1. In your app's src/app/app-routing.module.ts file,
import the RouterModule and ExtraOptions modules from @angular/router.
import { RouterModule, ExtraOptions } from '@angular/router';
2. In the RouterModule.forRoot() method, set the useHash property to false and configure the baseHref to your web server context path.
const routerOptions: ExtraOptions = {
useHash: false,
//baseHref: '/',
};
3. Add RouterModule.forRoot(routes, routerOptions) in imports array and remove RouterModule.forRoot(routes)
imports: [RouterModule.forRoot(routes, routerOptions)],
4. in your index.html add , this tells the browser where the app is located, so that it can correctly generate URLs for the routes.
...
Please make sure your server is configured to handle the URLs that will be used by your app. If you are serving your app from a subdirectory on your server, you will need to configure your server to redirect all requests to the index.html file so that the app can handle them. Also, in order to avoid page refresh issues with this approach, you should configure your web server to return the same index.html for all requests, including 404 errors. This way, when the Angular app loads, it will handle the routing on the client side and display the appropriate content without refreshing the page. It's also important to mention that if you're using a framework like Express to handle your server-side routing, you'll need to configure it to forward all requests to the index.html file so that the Angular app can handle them. Please let me know if you have any question or need more examples.