如何在这个 angular 2 示例上使用 HTML5 模式？

Question

我正在使用 chsakell 的这个例子来玩 angular 2。

我尝试做的第一件事是将“散列”网址替换为真实网址（例如http://localhost:9823/#/photos by http://localhost:9823/photos ）

根据这个链接，我必须使用PathLocationStrategy ，这是默认的路由策略。

为了做到这一点，我改变了这个

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

经过

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

但是哈希仍然出现。 如何摆脱 Angular 2 的 url 上的哈希值？

Answer 1

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

Answer 2

供参考，

...
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));