如何在此角度 2 样本上使用 HTML5 模式

How to use HTML5 mode on this angular 2 sample?

本文关键字：HTML5 模式 样本      更新时间：2023-09-26

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

我尝试做的第一件事是将"散列"网址替换为真实网址（例如 http://localhost:9823/photos 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 网址上的哈希？

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

仅供参考，

...
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));
相关文章：