angular - 如何使用 UI-Router 防止持久性 URL anchor 链接哈希值？

Question

我正在使用 Angular2 和 UI-Router 2在菜单中有一些 anchor 链接的简单应用程序的无哈希模式。例如:

• https://example.com/blah/blech
• https://example.com/blah/blech#specifications
• https://example.com/blah/derp

如果我从 URL 中带有散列的路由转到不带散列的路由，则散列仍然存在。例如，通过菜单从 /blah/blech#specifications 转到 /blah/derp 会导致浏览器地址为 /blah/derp#specifications。显然这是不正确的并且实际上有些限制，例如当我返回到 /blah/blech 并且哈希值仍然存在时，将窗口发送到该 anchor 位置。

另一个副作用是以某种不可预测的方式刷新页面。从 /blah/derp 到 /blah/blech#specifications 会导致整个页面刷新。

设置相当标准:

export let derpState: Ng2StateDeclaration = {
    name: 'derpState',
    component: DerpComponent,
    url: '/derp'
}

如何将散列链接与 UI-Router 2 结合起来取得良好的效果？ (或者，我如何以其他方式将 anchor 链接与 UI-Router 一起使用？)

Answer 1

您使用哪个版本的 angular 2？请升级它。不需要名字和所有。

import { ModuleWithProviders }  from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { DerpComponent }    from './derp.component';

const derp: Routes = [
{ path: 'derp',  component: DerpComponent }
];
export const derpState: ModuleWithProviders = RouterModule.forChild(derp);

试试这个。希望这对您有所帮助。