Question

我想构建一个有2个标签的应用程序，一个将有一个表单，另一个标签用于查看表单中填写的数据。我有一个导航，有2个链接，正在改变ng-view div。我的问题是每当我点击评论链接时，它会重置我在表单中填写的所有数据。控制器js：

var MainApp = angular.module("MainApp",['ngRoute']);
   function appRouteConfig($routeProvider){
    $routeProvider.
        when('/',{
            controller: 'MainCtrl',
            templateUrl: 'add.html',
        }).
        when('/review',{
            controller: 'MainCtrl',
            templateUrl: 'review.html',
        }).
        otherwise({
            redirectTo: '/'
        });
}
var MainCtrl = MainApp.controller("MainCtrl", function($scope) {
    $scope.campaign = {cName:''};
});

表单输入，例如：

<tr> 
    <td>Campaign Name</td>
    <td><input type="text" id="cName" ng-model='campaign.cName' /></td>
</tr>
<tr>

当我将视图从add.html（表单所在位置）更改为review.html时，表单中的所有数据都会重置，因此我的评论页面上没有数据显示，当我切换回add.html时查看，所有输入都是空白的。

我在视图之间切换时是否可以保留数据？

Answer 1

如果您的意思是浏览器标签，那么我建议查看会话/本地存储，但如果您的意思是在两个视图之间维护数据，那么您将创建一个单独的服务，两个视图（也称为控制器）都可以访问。视图加载时会创建一个新的控制器实例，这就是丢失数据的原因。

Egghead has great tutorials on all things angular

Answer 2

在上面的示例中，campaign.cName绑定到$ scope，后者使用控制器进行实例化，因此在视图之间切换时会丢失。使用活动对象创建服务，并将服务注入控制器。绑定到服务对象将在视图/控制器之间保留数据。

使用角度路由在页面之间传递表单数据

2 个答案: