How to use HTML5 mode on this angular 2 sample?

Question

I'm playing a little with angular 2 using this example from chsakell.

First thing I tried to do it's to replace "hashed" urls to real urls (Eg http://localhost:9823/#/photos by http://localhost:9823/photos )

According this link, I have to use PathLocationStrategy , which is the default routing strategy.

In order to do this, I changed this

bootstrap(AppRoot, [HTTP_PROVIDERS, ROUTER_PROVIDERS,
    provide(RequestOptions, { useClass: AppBaseRequestOptions }),
    provide(LocationStrategy, { useClass: HashLocationStrategy }),
    DataService, MembershipService, UtilityService])
    .catch(err => console.error(err));

by

bootstrap(AppRoot, [HTTP_PROVIDERS, ROUTER_PROVIDERS,
    provide(RequestOptions, { useClass: AppBaseRequestOptions }),
    provide(APP_BASE_HREF, { useValue: '/' }),
    DataService, MembershipService, UtilityService])
    .catch(err => console.error(err));

But hash still show up. How can I get rid of the hash on url for Angular 2?

Answer 1

清除浏览器缓存或强制重新加载ctrl + F5 。

Answer 2

FYI,

...
import {Component,bind} from 'angular2/core';
import {Router,ROUTER_PROVIDERS,RouteConfig, ROUTER_DIRECTIVES,APP_BASE_HREF,LocationStrategy,RouteParams,ROUTER_BINDINGS} from 'angular2/router';


bootstrap(AppRoot, [HTTP_PROVIDERS, ROUTER_PROVIDERS,
          provide(RequestOptions, { useClass: AppBaseRequestOptions }),
          bind(APP_BASE_HREF).toValue(location.pathname),
          DataService, MembershipService, UtilityService])
            .catch(err => console.error(err));