Angularjs实现多个页面共享数据的方式.doc

　　本文给大家介绍使用Angularjs实现多个页面共享数据的方式，通过定义一个共享服务service来实现此功能，对angularjs共享数据相关知识感兴趣的朋友一起学习
　　使用service来共享数据
　　定义一个共享服务的service
　　//家电维修共享数据的服务 
　　angular.module("sqhApp").factory("repairDeviceDataShareServer",function($http,$state,$ionicPopup){ 
　　return { 
　　//缓存当前需要维修的设备名称、数量、唯一标识 
　　deviceRepairObj : [], 
　　//小区位置 
　　xiquLocation:{}, 
　　//预约时间 
　　appointmentDate:{ 
　　"date":"", 
　　"time":""
　　}, 
　　//预约日期界面回退到上一个界面的记录 
　　appointmentBackPage:"", 
　　//获取地址回退界面记录 
　　locationBackPage:"", 
　　//家电维修描述 
　　questionDesc:"", 
　　//确认预约 
　　confirmAppointment : function(resultJson){ 
　　var url = "/index.php/Wap/Homemake/createRepairOrder.html"; 
　　var p = $http.post(url,resultJson); 
　　p.success(function(response,header,config,status){ 
　　//提交订单成功 
　　if(response.status == 0){ 
　　//提示需要选择设备 
　　var alertPopup = $ionicPopup.alert({ 
　　title: '家电维修', 
　　template: response.msg 
　　}); 
　　alertPopup.then(function(res) { 
　　$state.go("appliance_index"); 
　　}); 
　　}else{ 
　　//提示需要选择设备 
　　var alertPopup = $ionicPopup.alert({ 
　　title: '家电维修', 
　　template: response.msg 
　　}); 
　　alertPopup.then(function(res) { 
　　}); 
　　} 
　　}); 
　　}, 
　　//确认预约提交的数据 
　　formData:{} 
　　}; 
　　});
　　跳转到一个新的页面，将repairDeviceDataShareServer注入到controller中
　　//预约时间控制器 
　　angular.module("sqhApp").controller("orderDateController", ["$scope", "$state", 
　　'$ionicPopup', 'repairDeviceDataShareServer','appointmentDateService', 
　　function ($scope, $state, $ionicPopup,repairDeviceDataShareServer,appointmentDateService) { 

　　$scope.lists=[]; 
　　//从服务器获取时间 
　　appointmentDateService.getAppointmentDateList($scope); 
　　//回退到上一个页面 
　　$scope.back = function(){ 
　　var backPage = repairDeviceDataShareServer.appointmentBackPage; 
　　//如果没有记录值，则跳转到家电清洗服务包目录 
　　if(backPage == ""){ 

　　$state.go("appliance_index"); 
　　}else{ 
　　$state.go(backPage); 
　　} 
　　} 
　　//选择时间 
　　$scope.selectTime = function(myevent){ 
　　var currentObj = $(myevent.target); 
　　currentObj.closest("div.time_list").find(".line_height_35px").removeClass("bg_fdd000 color_e5005a").addClass("bg_ff"); 
　　currentObj.addClass("bg_fdd000 color_e5005a").removeClass("bg_ff"); 
　　}; 
　　//选择日期 
　　$scope.selectDate = function(myevent){ 
　　var currentObj = $(myevent.target); 
　　currentObj.closest("div.overflow_hidden").find("div.float_left").removeClass("color_e5005a"); 
　　currentObj.closest("div.float_left").addClass("color_e5005a"); 
　　}; 
　　//确认时间日期 
　　$scope.confirmDateTime = function(){ 
　　var selectObjs = $(".bg_f8f8f8 .color_e5005a"); 
　　//获取日期对象 
　　var dateObj = $(selectObjs[0]); 
　　if(dateObj.length ==　0){ 
　　alert("请选择日期"); 
　　return false; 
　　} 
　　//获取时间对象 
　　var timeObj = $(selectObjs[1]); 

　　if(timeObj.length ==　0){ 
　　alert("请选择时间"); 
　　return false; 
　　} 
　　//repairDeviceDataShareServer.appointmentDate.date = dateObj; 
　　repairDeviceDataShareServer.appointmentDate.date = "2016-6-6"; 
　　repairDeviceDataShareServer.appointmentDate.time = timeObj.html(); 
　　this.back(); 
　　}; 
　　}]);
　　跳转到一个新的页面中，然后重置repairDeviceDataShareServer里面的数据
　　angular.module("sqhApp").controller("applianceIndexController", ["$scope", "$state","repairDeviceDataShareServer","applianceWashShareServer", function ($scope, $state, repairDeviceDataShareServer,applianceWashShareServer) { 
　　//初始化家电维修共享数据 
　　repairDeviceDataShareServer.deviceRepairObj = []; 
　　repairDeviceDataShareServer.xiquLocation = {}; 
　　repairDeviceDataShareServer.appointmentDate = {"date":"","time":""}; 
　　repairDeviceDataShareServer.appointmentBackPage = {}; 
　　repairDeviceDataShareServer.locationBackPage = {}; 
　　repairDeviceDataShareServer.formData = {}; 
　　repairDeviceDataShareServer.questionDesc = ""; 
　　//初始化家电清洗共享数据 
　　applianceWashShareServer.washType=""; 
　　applianceWashShareServer.formData={}; 
　　applianceWashShareServer.goodsSelected=[]; 
　　}]);
　　关于本文给大家分享的Angularjs实现多个页面共享数据的方式就给大家介绍这么多，希望对大家有所帮助！