Angular.js 应用程序中子页面上的 history.pushState

history.pushState on sub pages in an Angular.js application

提问人:WKFY 提问时间:12/17/2022 最后编辑:WKFY 更新时间:12/29/2022 访问量:97

问:

我有一个空白的 Angular.js 6 应用程序,用于路由,并且在子路由(例如)上并执行以下命令:PathLocationStrategy/test

history.pushState({}, '', '#abc');
window.dispatchEvent(new HashChangeEvent('hashchange'));

我希望将 URL 更改为,而是将页面和 URL 更改为主页 ()。/test#abc/#abc

这可以通过假装使用基本 URL 来解决,例如:

history.pushState({}, '', (new URL(window.location.href)).pathname + '#abc');

不幸的是,在这种情况下,我无法控制该命令,因为它是从广告外部执行的。history.pushState

我也在一个新的 Angular 15 应用程序中尝试过这个,同样 URL 更新为 而不是,但页面没有改变。 但是,例如,在新的 Nuxt.js 应用中,它的行为符合预期并停留在测试页面上,并且 URL 变为 .所以它似乎可能与Angular.js有关。/#abc/test#abc/test#abc

有谁知道我如何配置我的 Angular 应用程序,使其在执行时停留在子页面上:

history.pushState({}, '', '#abc');
window.dispatchEvent(new HashChangeEvent('hashchange'));

谢谢!

angularjs pushstate

评论


答:

0赞 WKFY 12/29/2022 #1

通过执行以下操作修复它:

  • 删除了文件中的元素<base href="/">src/index.html
  • 在文件中添加了提供程序{ provide: APP_BASE_HREF, useValue: '/' }src/app/app.module.ts
  • 添加到文件中的配置"deployUrl": "/"buildangular.json