【问题标题】:Angular reloads the whole app on navigating back (location.back)Angular 在返回时重新加载整个应用程序 (location.back)
【发布时间】:2018-05-18 08:53:21
【问题描述】:

我注意到 location.back() 在我的 StackBlitz.com 英雄之旅应用程序中重新加载整个应用程序。

为什么会这样?

https://stackblitz.com/angular/qvvrbgrmmda?file=src%2Fapp%2Fhero-detail%2Fhero-detail.component.ts

【问题讨论】:

  • 您能解释一下无法正常工作是什么意思吗?
  • 它按预期工作。你希望它做什么,具体一点?

标签: angular angular-router


【解决方案1】:

添加

import {CommonModule, HashLocationStrategy, LocationStrategy} from '@angular/common';

  providers: [
    {
      provide: LocationStrategy,
      useClass:  HashLocationStrategy
    }
  ],

  imports: [
    CommonModule,
  // ...

在您的 app.module.ts 中

现在,您的 URL 中有一个 #,它可以防止应用程序在您每次在应用程序中导航时加载整个应用程序的新实例。在您问之前,摆脱 # 的唯一方法是通过服务器端渲染,例如使用 Angular Universal 您还需要使用本地存储或后端调用来保存应用程序状态,这不是一个好习惯。所以只要坚持#。欲了解更多信息,请参阅https://stackoverflow.com/a/37031886/4125622

【讨论】:

  • 感谢@Phil,仍然无法正常工作。单击“返回”按钮时,页面不会导航到上一页。这是 Angular 的官方应用程序。
  • 当我在一个完整的窗口中打开应用程序时,它似乎工作正常。与左侧的源代码一起运行时,location.back() 不起作用,应用程序无法导航到上一页。
  • 当我进行更改时,它对我有用。你如何重现这个错误?
  • 尝试在右侧打开输出的情况下运行应用程序。当我在全窗口中运行应用程序时,一切正常,但在右侧打开输出窗口时却不行。谢谢
【解决方案2】:

这是由 StackBlitz 提供的拆分窗格预览功能引起的;这不是 Angular 教程的问题。如果您使用完整的窗口预览,则不会发生。所以点击“在新窗口中打开”来避免这个问题。

【讨论】:

    猜你喜欢
    • 2021-01-23
    • 1970-01-01
    • 2014-10-10
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-11-02
    相关资源
    最近更新 更多