Estoy siguiendo los ejemplos de enrutamiento de Angular 2. Usando el servidor web "lite", puedo navegar desde la raíz y los enlaces profundos funcionan, pero usando Apache puedo navegar desde la raíz, pero obtengo errores 404 No encontrado cuando sigo enlaces directos a rutas.
Por ejemplo, la siguiente URL funciona contra el servidor web "lite" iniciado en el puerto 3000 por npm.
http://localhost:3000/crisis-center/2Pero la siguiente URL contra Apache que se ejecuta en el puerto 80 falla.
http://localhost/crisis-center/2 The requested URL /crisis-center/2 was not found on this server.Probé algunas soluciones .htaccess recomendadas para problemas similares de Angular 1, pero no tuve suerte. Si alguien ha tenido enrutamiento Angular 2 y trabajo de enlace profundo en Apache, hágame saber cómo lo logró.
@RouteConfig([ { // Crisis Center child route path: '/crisis-center/...', name: 'CrisisCenter', component: CrisisCenterComponent, useAsDefault: true }, {path: '/heroes', name: 'Heroes', component: HeroListComponent}, {path: '/hero/:id', name: 'HeroDetail', component: HeroDetailComponent}, {path: '/disaster', name: 'Asteroid', redirectTo: ['CrisisCenter', 'CrisisDetail', {id:3}]} ])Arranque.ts
import {bootstrap} from 'angular2/platform/browser'; import {ROUTER_PROVIDERS} from 'angular2/router'; import {AppComponent} from './app.component'; bootstrap(AppComponent, [ROUTER_PROVIDERS]);Como las otras respuestas realmente no responden a la pregunta de si desea que funcione con Apache. HashLocationStrategy sigue siendo una opción, pero si desea que funcione como está en Apache, debe hacer lo siguiente:
Cree un nuevo archivo .htaccess en la misma ubicación que su index.html . El siguiente código estará dentro:
<IfModule mod_rewrite.c> Options Indexes FollowSymLinks RewriteEngine On RewriteBase /crisis-center/ RewriteRule ^index\.html$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . index.html [L] </IfModule> (Tenga en cuenta que en la pregunta <base href="/crises-center/"> dentro de index.html debe ser idéntico a RewriteBase)
Respuesta adaptada de pregunta+respuesta del enrutamiento Angular 2 y acceso directo a una ruta específica: ¿cómo configurar Apache?
Para aquellos que se ejecutan en Apache, use este .htaccess
<IfModule mod_rewrite.c> RewriteEngine on RewriteCond %{REQUEST_FILENAME} -s [OR] RewriteCond %{REQUEST_FILENAME} -l [OR] RewriteCond %{REQUEST_FILENAME} -d RewriteRule ^.*$ - [NC,L] RewriteRule ^(.*) /index.html [NC,L] </IfModule>Si aún recibe un error, ejecute esos 2 comandos:
sudo a2enmod rewrite sudo systemctl restart apache2Para angular4/angular en app.routes.module.ts incluya useHash como se muestra a continuación,
@NgModule({ imports: [RouterModule.forRoot(routes, {useHash: true})], exports: [RouterModule] })