问题标签 [angular-router-guards]

我在一个应用程序中有多个表单，并且我有一个 CanDeactivate 守卫，它会提示用户确认他们是否要在不先保存他们编辑的表单的情况下离开页面。每个带有表单的组件都有一个hasBeenEdited检查表单是否被编辑过的功能。由于我只有一个 CanDeactivate 可注入类来处理所有这些带有表单的组件，因此我需要访问hasBeenEdited用户当前路由到的组件的功能。如何最好地做到这一点？我见过一些例子，其中canDeactivate保护类中的函数被传递一个组件参数，但我不确定如何传递当前路由的组​​件。

当用户在页面上完成输入数据后，我希望他们返回上一页（例如主页 -> 输入页面）。如果我在他们单击提交时重定向他们，我将得到一个循环历史记录（主页 -> 输入页面 -> 主页）。因此，当用户单击提交时，我调用window.history.back().

为了防止数据丢失，我监听了 beforeUnload 事件。如果用户尚未提交表单，我会提示确保他们知道他们将丢失所做的更改。

我遇到的问题是，如果用户在不提交数据的情况下尝试返回，请单击取消以留在页面上，然后单击提交。他们第一次回击被取消，然后在提交后我执行 history.back()，但这最终会返回历史记录中的 2 个条目而不是 1 个。几乎就像当我取消返回事件时，前一个 URL （主页）一起从历史堆栈中删除。因此，点击提交会越过该页面并返回到新标签页。

我知道堆栈管理非常困难，但是如果用户取消 onBeforeUnload 以留在页面上并且点击提交，则无法弄清楚如何转到上一个 URL。似乎如果用户取消它，当我调用 history.back() 它应该回到主页。

然后AuthGuard的构造函数：

...但是两者.params和.snapshot.params都是空的，并且不能:l从那里读取任何参数的值（“语言”的缩写）。

所以问题：如果有未经授权的访问，我如何重定向到另一个页面，让我的动态 :l到位？

PSdata不起作用（是吗？），因为它可以用于编译时已知数据而不是动态数据。

我在使用 Angular 6 路由保护时遇到问题。当我点击登录按钮时，它不会将我重定向到预期的路线。我的 html 调用该login()函数，而在执行该方法时返回，它loginService.isAutenticated在警卫本身中返回。truedoLogin()false

登录组件.ts

登录服务.ts

应用程序.routes.ts

auth.guard.ts

我有一个具有输入字段的Angular 6组件。如果用户尝试离开时任何输入字段验证失败，则将触发该canDeactivate功能的守卫。守卫是通用的，因为此逻辑需要在应用程序中的多个组件上发生。它运行得很好，但是当我尝试对这种行为进行单元测试时，canDeactivate永远无法达到防护中的功能。到达守卫本身，但从未到达功能。我是否以不正确的方式提供警卫？

防护组件接口

可以停用Guard

零件

规格

测试失败，因为canDeactivate从未达到功能。

如何从父路由的守卫重定向到子路由，同时保护子路由不被直接访问*？

绝对导航的问题，当导航到子路由时，父组件上的守卫会在循环中再次调用。

相对导航的问题是守卫正在保护父路由，因此还没有激活的路由可以相对导航。此外，这可能不会保护子路由。也许同样的守卫也可以用于子路由或 CanActivateChildren。

Stackblitz 示例：https ://stackblitz.com/edit/angular-qbe2a7

路线

canActivate() 在守卫中

*为什么不为您可能要求的所有孩子添加警卫。我需要根据应用程序的状态从父路由重定向到许多不同的子路由。我目前正在使用其中一个子路由从该组件重定向，但这并不能保护子路由形成用户直接导航。

我有一个路由配置，它允许用户根据如下标准查看最近完成的活动：

解析器从存储在服务类中的数组列表中返回一个对象。我没有直接访问我的 VerifyComponent 中的服务类，因为我打算很快从数组更改为 HTTP 请求。

在我的子组件上，我从可观察的数据中获取详细信息，如下所示：

我无法理解为什么数据不来这里。谁能指导我？提前致谢。

我是 Angular 的新手，我也在互联网上搜索了这个问题，但找不到解决方案。谁能帮帮我吗？这对我来说太重要了。

我已经实现了一个可以停用路由保护，当我们导航到其他菜单时触发，当表单是dirty.

问题是当我在客户端菜单上并使表单变脏并导航到激活菜单时，会出现一个弹出窗口，需要我确认离开页面（按预期工作）。但是，当我单击取消按钮（希望留在表单页面（客户端）上）时，它无论如何都会让我留在页面上，但是，激活选项卡显示它处于活动状态。

canDeactivate组件中的方法

路由.ts

在角度路由器解析器的resolve方法中，有没有办法区分（由于缺乏更好的术语）硬导航（会话中的页面刷新和首次访问）和软导航（会话中的后续访问通过向前或向后遍历）？

这是我的场景。我总是需要从服务器获取数据以进行硬导航，而我只是偶尔需要从服务器获取数据以进行软导航。然而，更典型的是，对于软导航，我只执行其他不需要与服务器交互但确实使用路由中的参数值的任务。

介绍

我正在尝试Angular2+使用共享服务中的 Observable 创建一个路由保护，该服务包含当前用户角色的字符串值。
问题显然在于将我的想法从 Promise 转移到 Observables。

到目前为止，我所做的是基于启发式和尝试和错误方法，但我通过杀死浏览器撞到了墙解决了感谢 danday74

.

尝试（感谢@danday74 改进）

借助相当于promise.then() 的 RxJS 序列？我已经将我想做的事情翻译成这个链：

问题

如果 ，如何停止可观察链的进一步传播isRoleAuthenticated = true？如果满足这样的条件，我需要返回该布尔值，并确保.do之后不调用操作符块。
限制是必须从canActivate守卫返回布尔值。