Javascript angularjs-路由时如何保留当前视图数据

我对angularjs有意见。 2有两种观点：

视图1包含这些控件

• 名为txtBox1且具有默认空白值的文本框
• 一个名为“更改”的按钮，用于将txtBox1中的文本更改为“已更改！”

视图2

• 名为txtBox2的文本框

首先，我导航到View1，单击按钮，txtBox1的内容将更改为“changed！”。然后导航到View2，然后返回View1

那么，如何保存从View1输入txtBox1的数据呢？ 我使用过DurandalJs，他们有视图缓存选项，可以在导航时保持当前数据在视图中，但我不知道如何使用angularjs

---

@jimmy ng:您是否希望即使在刷新后也能存储数据？这很重要

如果您只希望当前应用程序运行时使用这些值，并且假定每个主视图都有一个ctrl，那么您可以通过helper服务类（data manager服务）存储表单数据：

然后，在view1Controller中，您只需设置表单数据：

 $scope.$on('$destroy', function () {
   view1DataManager.set('view1FormData', $scope.myModel.formStates);
 });

同样，在init/constructor上，重新加载这些状态：

 $scope.init = function () {
   $scope.myModel.formStates = view1DataManager.get('view1FormData');
 };

这是为了保存应用程序当前运行时的数据。对于将来的实例，只需更新数据管理器，将其设置为localStorage、websql甚至cookie（但不太推荐）

注意：您也可以将几乎所有内容存储在$rootScope中，但从任何角度来看（架构、性能等），这都是硬核。所以绝对是“不要去那里”的事情

更新： @jimmyng：基本上不可能将这些状态存储在对象（也称为ctrl）中，因为对象（当然）正在被丢弃并根据需要再次实例化

假设您的所有UI易失性数据都存储在“FormState”中，上述代码将处理您需要的内容。您正在使用AngularJS，因此小部件将绑定到ng模型。您还可以将选择等选项放在那里

// E.g.:
dropdownlist ---> ng-model -> formStates.selectedXXX
dropdownlist ---> ng-options-> formStates.xxxOptions
textbox ---> ng-model -> formStates.name
etc

---

一些简化的代码可能会有所帮助，但基本思想是您应该创建一个由两个控制器使用的数据服务，并将值存储在视图1上。这也将允许view2在需要时访问它。如果不需要，view2不需要引用该服务，因为它将由应用程序实例化，并在应用程序关闭之前保持实例化状态。您可以发布代码吗？事实上，我不想将表单数据存储在变量中。在导航到其他视图时，我希望使当前控件状态不变。您可以想象在视图1上您已经完成了以下操作：选择一个下拉列表，在文本框中键入。然后导航到视图2检查一些变量，然后返回视图1继续当前的工作。但一切都消失了，视图1刷新了。

// E.g.:
dropdownlist ---> ng-model -> formStates.selectedXXX
dropdownlist ---> ng-options-> formStates.xxxOptions
textbox ---> ng-model -> formStates.name
etc