javascript - Angular 导航和模块中的问题

Question

我在我的 Angular 页面中有一个名为"Process Loan"的按钮。当员工单击此按钮时，他会来到另一个包含三个链接的页面。这 3 个链接中的每一个都指向一个单独的页面，用户可以在其中填写表格并将其发送到服务器。这 3 个包含表单的页面是模块内的 Angular 组件（我们称之为“my-process-loan-module”）。这意味着当用户点击“Process Loan”按钮时，他会进入一个包含 3 个组件的模块。每个组件都是一个表单。

我现在面临的挑战是有很多员工，我们希望确保一次只有一名员工可以访问“处理贷款”按钮。当员工点击按钮时，必须为其他员工禁用它。

即使没有填写表格，第一个点击“处理贷款”按钮的员工也可以浏览 3 个页面/组件。只要他/她在任何页面内，其他员工都无法访问“处理贷款”按钮。

我曾canDeActivate在 Angular 中学习过，但它似乎只适用于组件。我正在寻找是否可以canDeActivate为Angular模块做（因为3个组件（页面）在一个模块内），这样当第一个员工退出模块（远离模块内的组件）时，我可以重新激活“进程其他员工的“贷款”按钮。

我正在寻找一种方法来确定第一个员工将访问的页面不是"my-process-loan-module"中的页面（组件）的一部分。

更新

在服务器上，我设置了一个布尔值，即当第一个员工单击该按钮时，“处理贷款”按钮处于非活动状态。我需要知道员工何时退出模块中的页面，以便我可以为想要使用“处理贷款”按钮的其他员工启用状态。

标签： javascriptangularangular-ui-router

Answer 1

当用户离开给定组件时，该组件的ngOnDestroy()方法被调用。将任何需要的销毁逻辑放在那里。

编辑：如果您需要确保即使用户关闭窗口也会触发它，请添加@HostListener('window:beforeunload')装饰器。