Solución:
Como señaló @Volodymyr Bilyachat, PathLocationStrategy
es una estrategia de ubicación predeterminada en Angular2, y si el #
está presente en la URL, debe haber sido anulado en alguna parte.
Además de los proveedores de módulos, verifique las importaciones de sus módulos, también se puede anular proporcionando el { useHash: true }
como el segundo argumento de la RouterModule.forRoot
:
imports: [
...
RouterModule.forRoot(routes, { useHash: true }) // remove second argument
]
También tenga en cuenta que al usar PathLocationStrategy
necesita configurar su servidor web para servir index.html
(punto de entrada de la aplicación) para todas las ubicaciones solicitadas.
En angular hay estrategia de ubicación
Mire en app.module.ts donde la aplicación se inicia, allí tiene
@NgModule({
.......
providers: [
....
{ provide: LocationStrategy, useClass: HashLocationStrategy },
....
]
});
Y elimine esta parte ya que PathLocationStrategy es la estrategia predeterminada
Las respuestas anteriores tienen la explicación correcta sobre cómo eliminar el Hash de la URL, pero cuando cambia LocationStrategy
su back-end se verá afectado porque el back-end no comprende todos sus Angular 2
Rutas. Estos son los pasos para eliminar el hash con el soporte de back-end.
1) Cambie Angular para usar PathLocationStrategy
@NgModule({
.....
providers: [
// Below line is optional as default LocationStrategy is PathLocationStrategy
{provide: LocationStrategy, useClass: PathLocationStrategy}
]
})
2) Cambie el Href base en index.html, Angular2 manejará todas las rutas después del Href base
<base href="https://foroayuda.es/app-context/">
Por ejemplo
<base href="https://foroayuda.es/app/">
3) En el servidor backend, debemos renderizar el archivo index.html para cualquier solicitud que venga con el patrón siguiente
"/app/**" - Render index.html for any request coming with "/app/**" pattern
index.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>My App</title>
<base href="https://foroayuda.es/app/">
</head>
<body>
<app-root>Loading...</app-root>
<script type="text/javascript" src="vendor.bundle.js"></script>
<script type="text/javascript" src="main.bundle.js"></script>
</body>
</html>