使用AngularJS服务将数据从一个html传输到另一个html(控制器之间的数据共享）

Transfer data from one html to another using AngularJS services (data share between controllers)

本文关键字：html 另一个 传输 控制器 之间 数据共享 AngularJS 一个 数据 服务 使用      更新时间：2023-09-26

我已经查找了几个具有类似问题的帖子，但无法找到适合我的情况的解决方案。

我有一个搜索页面，它向后端发送请求，并在页面上填充搜索结果（每个结果都是一个对象）。我显示每个对象的简明视图，并且在鼠标单击特定对象时，用户应被重定向到显示该对象的更详细视图的页面。

在我的JS端，我有一个控制器来处理$http.post调用并从后端检索对象以显示在第一页上。我在第二页上使用不同的控制器来尝试从第一个控制器获取相关对象（通过 angular 的.service），但由于某种原因，我在第二页上得到了一个空对象。该服务适用于吸气器和二传手。该服务能够通过第一个控制器很好地设置对象，并且我能够打印它。但是，当重定向到第二页时，在使用第二个控制器的 getter 时，由于某种原因，对象被删除并显示为空。

这是相关代码。服务内容：

app.service('shareService', function(){
  var savedData = {}
  function set(data) {
    savedData = data
    console.log(savedData);
  }
  function get() {
    console.log(savedData);
    return savedData;
  }
  return {
    set: set,
    get: get
  }
});

搜索（二传手）控制者：

app.controller('SearchCtrl', function(shareService, $scope, $http) {
   $scope.sendSearch = function() {
     $http.post("http://localhost:9080/MedNetApp/rest/mednet/searchCollections",   json).success(function (response) {		
    $scope.collections = response.searchResults;
    shareService.set($scope.collections);
     });
   };
 });

第二个（吸气器）控制器：

app.controller('CollectionsCtrl', function(shareService, $scope){
  $scope.collections = shareService.get();		
})

不确定这是否相关，但这也是我设置临时测试按钮以重定向到第二页的 html 部分：

<button id=mixing type = "button" class="btn btn-primary-aligned"
        data-ng-click = "go('second-page.html')">temp</button>

因此，在最后，savedData通过 get() 函数第二次打印时显示为空对象。知道为什么这不起作用吗？还是将数据发送到新页面的更好方法？

编辑 - 我应该提到我基本上依赖于这个解决方案：AngularJS - 在页面之间传递数据

因此，经过进一步研究，我遇到了这个解决方案：

在 AngularJS 中的页面之间共享数据返回空

如上面的链接所述，我在服务中使用了sessionStorage，它解决了问题。

使用 localStorage 或 sessionStorage

 var myJson ={};
 localStorage.set("your_Data",myJson);
 // to get the value from another page
 var returnJson  = localStorage.get("Your_Data");
相关文章：