Angularjs实现多个页面共享数据的方式
废话不多说了,直接看干货吧。
使用service来共享数据
定义一个共享服务的service
//家电维修共享数据的服务
angular.module("sqhApp").factory("repairDeviceDataShareServer",function($http,$state,$ionicPopup){
return{
//缓存当前需要维修的设备名称、数量、唯一标识
deviceRepairObj:[],
//小区位置
xiquLocation:{},
//预约时间
appointmentDate:{
"date":"",
"time":""
},
//预约日期界面回退到上一个界面的记录
appointmentBackPage:"",
//获取地址回退界面记录
locationBackPage:"",
//家电维修描述
questionDesc:"",
//确认预约
confirmAppointment:function(resultJson){
varurl="/index.php/Wap/Homemake/createRepairOrder.html";
varp=$http.post(url,resultJson);
p.success(function(response,header,config,status){
//提交订单成功
if(response.status==0){
//提示需要选择设备
varalertPopup=$ionicPopup.alert({
title:'家电维修',
template:response.msg
});
alertPopup.then(function(res){
$state.go("appliance_index");
});
}else{
//提示需要选择设备
varalertPopup=$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(){
varbackPage=repairDeviceDataShareServer.appointmentBackPage;
//如果没有记录值,则跳转到家电清洗服务包目录
if(backPage==""){
$state.go("appliance_index");
}else{
$state.go(backPage);
}
}
//选择时间
$scope.selectTime=function(myevent){
varcurrentObj=$(myevent.target);
currentObj.closest("div.time_list").find(".line_height_35px").removeClass("bg_fdd000color_e5005a").addClass("bg_ff");
currentObj.addClass("bg_fdd000color_e5005a").removeClass("bg_ff");
};
//选择日期
$scope.selectDate=function(myevent){
varcurrentObj=$(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(){
varselectObjs=$(".bg_f8f8f8.color_e5005a");
//获取日期对象
vardateObj=$(selectObjs[0]);
if(dateObj.length==0){
alert("请选择日期");
returnfalse;
}
//获取时间对象
vartimeObj=$(selectObjs[1]);
if(timeObj.length==0){
alert("请选择时间");
returnfalse;
}
//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实现多个页面共享数据的方式就给大家介绍这么多,希望对大家有所帮助!