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

通常我编写SPA并在控制器之间共享数据对于服务来说很简单。在AngularJS中的页面之间共享数据返回空

我没有使用SPA格式（不使用ng-view），并试图在页面之间共享数据，但是在加载第二页（获取数据）时它是空的。

PAGE1（index.html的）：

<div ng-controller="CreateList"> 
    <input type="text" ng-model="myValue"> 
    <div ng-click="share(myValue)">Share</div> 
</div>

PAGE2：

<div ng-controller="GeList"> 
    <p>{{ sharedData }}</p> 
</div>

JS：

app.controller('CreateList', function($scope, $location, $http, serviceShareData) { 

    $scope.share= function (selectedValue) { 

     if (selectedValue === undefined) { 
      console.log ("its undefined"); 
     }  
     else { 
      console.log (selectedValue); 

      serviceShareData.addData(selectedValue); 
      window.location.href = "PAGE2.html"; 
     } 
    } 

}); 


app.controller('GeList', function($scope, $location, $http, serviceShareData) { 

    $scope.sharedData = serviceShareData.getData(); 

    console.log($scope.sharedData); 

}); 

app.service('serviceShareData', function() { 
    var myData = []; 

    var addData = function(newObj) { 
     myData.push(newObj); 
    } 

    var getData = function(){ 
     return myData; 
    } 

    return { 
     addData: addData, 
     getData: getData 
    }; 
});

这里有一个plunkr：http://plnkr.co/edit/6VHJhirnHZxBpKOvqzI6?p=preview

来源

2015-04-04 Oam Psy

一个不同的应用程序将在page2.html实例化，所以该服务将是一个新的服务，你的数据消失了。 – 2015-04-04 16:45:46

只要SPA被加载，共享只能工作。只要您重定向\刷新页面，数据将会丢失。 – Chandermani 2015-04-04 16:46:43

有多种方式共享页之间的数据 - 本地存储，会话存储，索引资料，饼干或者你甚至可以传给你的数据作为这样的放慢参数：

window.location.href = 'page2.html?val=' + selectedValue;

下面是一个简单的例子如何您的服务可以使用的sessionStorage寻找：

app.service('serviceShareData', function($window) { 
    var KEY = 'App.SelectedValue'; 

    var addData = function(newObj) { 
     var mydata = $window.sessionStorage.getItem(KEY); 
     if (mydata) { 
      mydata = JSON.parse(mydata); 
     } else { 
      mydata = []; 
     } 
     mydata.push(newObj); 
     $window.sessionStorage.setItem(KEY, JSON.stringify(mydata)); 
    }; 

    var getData = function(){ 
     var mydata = $window.sessionStorage.getItem(KEY); 
     if (mydata) { 
      mydata = JSON.parse(mydata); 
     } 
     return myData || []; 
    }; 

    return { 
     addData: addData, 
     getData: getData 
    }; 
});

Plunkr是here。

来源

2015-04-06 23:16:53

很好的例子和猛击。快速问题，什么是App.SelectedValue – 2015-04-08 08:28:18

@OamPsy会话存储是一个键值存储引擎。 App.SelectedValue实际上是用于读取/写入数据的关键。可以是任何东西。 – 2015-04-08 16:54:21

当你重装这样

window.location.href = “PAGE2.html” 页面;

该应用程序被所有控制器，服务等重新初始化。在您的服务中使用网络存储来存储数据。

不要在您的应用程序中使用默认的js窗口对象。如果您需要使用位置信息，请使用$ location服务。如果您需要获取窗口属性，请使用$ window对象。

使用ng-view或者尝试ui-router。

来源

2015-04-04 21:04:20 IvanMalenko

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

回答

相关问题