Angular 2.0 deep link does not work. Same from address bar

Question

Everything works fine when I create and navigate the links in the application, but there’s no typing in the address bar! In the end, I want to be able to send a link to a specific page / path via email, and I'm not sure how to do it.

I have completed the angular documentation on the router . Right, I think ...

I am using NodeJS (with expression), and on the server I redirected all the traffic to the root of the application.

app.get("*", function(req, res) { console.error("in get *") res.redirect("/"); }); 

In my index.html I set base

 <base href="/"> 

I have my client routes / paths set as follows

 const appRoutes: Routes = [ { path: 'vendor/registration', component: VendorRegistrationComponent }, { path: 'vendors', component: VendorListComponent }, { path: '', redirectTo: 'vendor/registration', pathMatch: 'full' }, { path: '**', component: PageNotFoundComponent } ]; 

If I type http://localhost:8080/vendors in the address bar of the browser, I will get to http://localhost:8080/vendor/registration , which makes sense because the one where the server tells the browser to redirect.

How should I deeply bind my application?

Change The Angular tutorial - "TOUR HEROES" - also demonstrates the same behavior. those. entering URLs in the address bar of the browser does not work directly. The application displays the text "loading ..." and is not sent to the controller.

Answer 1

The answer to your question is explicitly described in the angular2 documentation

Answer 2

As a rule, you do not need to redirect to the server, since all your routing is handled by the angular router on the client.

Instead of having your route convenient for everyone, just always serve your index.html for all the requested URLs. When the client application loads, angular will take care of routing to the appropriate component based on the requested URL. Be sure to keep the tag <base href="/"> so that angular can know which part of the URL is routed.

 const path = require('path'); app.get("*", function(req, res) { res.sendFile(path.join(__dirname, '/path/to/your/index.html')); });