Angular 4：路由到另一个组件后保存组件状态

Question

我正在开发一个带角度的应用程序，目前我遇到了这个问题：

我有一个组件，用户可以在其中填充三个选择框。之后他可以开始搜索以找到匹配的匹配。现在，他们可以点击匹配并显示详细信息。详细信息显示在第二个组件中。从组件1到2的转换通过

成功

[routerLink]="..."

我的问题是当我回到概述时，必须重新输入所有数据。如何保存第一个组件的状态，以便用户不必再次填写三个选择框？

Answer 1

1方法是将状态存储在本地存储中。因此，当您返回原始页面时，您可以查询该项目是否存在于本地存储中，如果该项目然后重新初始化。

let data = {};
localStorage.setItem('settings', data);

或者你可以通过路由器传回比赛和第四 参数。

https://angular.io/guide/router

Answer 2

在pod update或[(ngModelChange)]上，将输入内容保存在localStorage。

初始化表单组件时，在(input)中查找是否存在密钥，并将字段设置为该字段。