如何使用Angular将数据从一个视图传递到另一个视图

时间:2016-09-23 15:14:09

标签: angularjs asp.net-mvc post

我需要在视图之间传递数据。我有一个视图,你检查项目,然后另一个视图,你可以检查那些项目。问题是当您重定向到另一个页面时丢失了所有数据,因此我丢失了所选项目上的所有数据。

可能的解决方案?:

调用DB保存所有项目,然后在完成时删除(似乎不正确和浪费使用服务器)

有人告诉我你可以实际发布到页面,然后重定向

将数据保存在Angular服务中(我只是在变量中保存一个数字但是看起来似乎不起作用。在另一个SO帖子上看到这个)

编辑: 我刚看到一些关于AngularJS工厂的东西,但它似乎不适用于动态数据,似乎我尝试使用服务的东西而且它不起作用。

此处还有服务测试的代码。 Theres也只是调用GetTest和测试方法的控制器方法。

MutualService

var test = function (data) {
        test1 = data;
        console.log(data);
    };

Test: function (data) {
    return test(data);
},
GetTest: function () {
    return test1;
}

视图1

<button style="float: right; margin-bottom:20px;" class="btn btn-sm btn-primary" onclick="changeLocation()"> Change Location</button>
        <button style="float: right; margin-bottom:20px;" class="btn btn-sm btn-primary" ng-click="vm.Test(2)"> Purchase Order</button>


<script>
changeLocation = function () {
                window.location.href = '/Purchasing/Manage/CreateEditPurchaseOrder';
            }
</script>

3 个答案:

答案 0 :(得分:0)

您可以使用 Tempdata 将数据从一个视图传递到另一个视图。

答案 1 :(得分:0)

请查看以下答案。

public ActionResult Index()
{
  var model = new Review()
            {
                Body = "Start",
                Rating=5
            };
    TempData["ModelName"] = model;
    return RedirectToAction("About");
}

public ActionResult About() 
{     
    var model= TempData["ModelName"];     
    return View(model); 
} 

以下检查链接

http://www.squaredroot.com/2007/12/20/mvc-viewdata-vs-tempdata/

答案 2 :(得分:0)

因此,您可以在此处创建一个具有要共享值的AngularJS服务。将服务注入每个视图的控制器或指令。然后,通过将服务变量分配给两个Scope,您可以在两个位置具有相同的变量。

angular.module('myModule')
    .service('Test', [ 
       function () {
            var test = this;

            test.myValue = 'default';

            return test;
       }
    ]
);

angular.module('myModule')
    .directive('viewOne', [ 'Test' 
       function ( Test ) {
            return {
                 restrict: 'E',
                 templateUrl: 'my/path/to/viewOne',
                 scope: {},
                 link: function ( $scope ) {
                      $scope.myValue = Test.someValue;
                 }
            };
       }
    ]
);

angular.module('myModule')
        .directive('viewTwo', [ 'Test' 
           function ( Test ) {
                return {
                     restrict: 'E',
                     templateUrl: 'my/path/to/viewTwo',
                     scope: {},
                     link: function ( $scope ) {
                          $scope.myValue = Test.someValue;
                     }
                };
           }
        ]
    );