Routing doesn't work for me with intensive upgrade

Question

I looked at this source code: https://github.com/angular/angular.io/blob/master/public/docs/_examples/toh-5/dart/lib/app_component.dart

and it seems that my application will be routed right now when I go to the root.

local: 8080 /

Updating routes when I move my application, but it seems that if I am in something: localhost:8080/dashboard in basecase and doing a hard update, it fails. This will give me a 404 not found! error 404 not found! .

It will only work if I do: localhost:8080/#!/dashboard , but this is not the address passed to my application.

In index.html, I have: <base href="/">

My App_Component.dart file looks like this:

 import 'package:angular2/angular2.dart'; import 'package:angular2/router.dart'; import 'hero_component.dart'; import 'heroes_component.dart'; import 'dashboard_component.dart'; import 'hero_service.dart'; @Component( selector: "my-app", directives: const [ROUTER_DIRECTIVES], providers: const [HeroService, ROUTER_PROVIDERS], templateUrl: "app_component.html") @RouteConfig(const [ const Route( path: "/dashboard", name: "Dashboard", component: DashboardComponent, useAsDefault: true), const Route( path: "/detail/:id", name: "HeroDetail", component: HeroDetailComponent), const Route(path: "/heroes", name: "Heroes", component: HeroesComponent) ]) class AppComponent { String title = "Tour of Heroes"; } 

I seem to have a routing that works for everything but this.

My final state will do: localhost: 8080 / detail / 14, and it will open the correct component. This is something that is not done now on the new site link, as well as when navigating throughout the application.

Answer 1

To switch to HashLocationStrategy , change providers to

 bootstrap(AppComponent, [ HeroService, ROUTER_PROVIDERS, provide(LocationStrategy, useClass: HashLocationStrategy) ]) 

If you want to use PathLocationStrategy , you can use this pub serve -wrapper https://pub.dartlang.org/packages/pub_serve_rewrites , which allows you to use PathLocationStrategy with pub serve .

For deployment, you need to configure the web server that you use to support HTML5 pushState.

Answer 2

Routes exist only in your application, the server does not know anything, it just checks the path /dashboard or /detail/14 for the default page / file that does not exist.

You need to configure the server router to go to app index.html (your html name is here) for all your application routes.

Answer 3

If localhost:8080/#/dashboard works, but localhost:8080/dashboard fails, it is assumed that you are using HashLocationStrategy , not PathLocationStrategy .

When checking your bootstrap() function or somewhere else, make sure that no HashLocationStrategy been added.