Angularjs实现多个页面共享数据的方式
程序员文章站
2022-05-13 21:38:11
废话不多说了,直接看干货吧。
使用service来共享数据
定义一个共享服务的service
//家电维修共享数据的服务
angular.module...
废话不多说了,直接看干货吧。
使用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实现多个页面共享数据的方式就给大家介绍这么多,希望对大家有所帮助!