在更改页面上的选项卡之前警告用户未保存的更改

时间:2017-07-19 16:59:49

标签: angular angular2-routing

在我的Angular2页面上,我将数据分成3个不同的标签。这3个选项卡显示来自同一模型的3个不同部分的数据。每个选项卡都有保存数据选项。如果用户在不更改数据的情况下转到其他选项卡,我将如何警告用户未保存的更改?

请注意,此页面只有一个网址,每个标签都没有特定的路由器。

我是否真的需要为每个选项卡和生命周期回调CanDeactivate来处理这个?还有其他选择吗?我不想创建单独的路由器,因为这3个标签位于同一页面上。

1 个答案:

答案 0 :(得分:0)

我假设你可以对标签上的点击事件做出反应?这似乎是最有可能添加代码以确定用户是否进行了需要首先保存的更改的地方。

我使用标签创建了一个示例编辑应用程序,但我允许更新任何标签而不先保存更改。应用 要求用户在导出编辑之前进行保存。如果您有兴趣,可以在此处找到相应的代码:https://github.com/DeborahK/Angular-Routing/tree/master/APM-Final