How to make Angular 2 Router work by rewriting the URL in a deployed application?

Question

Now I'm finishing my Angular 2 application, and I wonder how to place it.

I just tried to create an application on my local host, and in fact everything is working fine, expect the Routerapplication. I cannot access the routes by rewriting the url because it is probably looking for some files and .htaccess RewriteRules, not routes. It is important for me to be able to access routes by rewriting the URL, because I do not want [routerLink]my admin panel and some other things to be publicly available (considered as a hyperlink).

To be more specific ... When I visit http://localhost/FinalApp/, it uses the router to go to http://localhost/FinalApp/list/page/1, so it is list/page/1added by the Angular 2 router. Everything [routerLink]works correctly and moves, for example. http://localhost/FinalAll/list/category/3when I click on them, but when I rewrite the URL manually to go to the admin panel (I add adminto my database http://localhost/FinalApp/, so the final URL looks like http://localhost/FinalApp/admin), it shows me 404 Error (not the default route of the router, but server side 404).

I want to be able to manually rewrite the url and use Angular 2 Router.

Am I missing something or is it just not possible?

Answer 1

HashLocationStrategy, # : http://localhost/FinalApp/list/page/1 http://localhost/#/FinalApp/list/page/1. , HashLocationStrategy AppModule :

{ provide: LocationStrategy, useClass: HashLocationStrategy }

LocationStrategy HashLocationStrategy @angular/common:

import { LocationStrategy, HashLocationStrategy } from '@angular/common';

RC4 , bootstrap:

bootstrap(
AppComponent,
    [
        { provide: LocationStrategy, useClass: HashLocationStrategy }
    ]);

Answer 2

, . href, , . - , - , http://localhost/FinalApp/admin. URL- URL- , , . :

apache rewrite

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(/.*)$ /index.html [L]