angular和webstorm 加载本地数据,实现“单机版”web应用
应用场景:
开发ionic web app应用,需要后台传输数据,才能正常使用,如果没有数据,那么app 就是只有效果的空壳。
目的:
1、为了给客户演示产品,在无网络的情况下,使用单机版的app 是再好不过了
2、开发ionic中,如果数据全部是自己模拟,加快开发速度
解决办法:
将angular的ajax请求改为请求本地数据
/** * 查询条件服务 * */ angular.module('houseApp') .factory('secondHouseService', ["ApiService", "WAP_CONFIG","publicService",function(ApiService, WAP_CONFIG,publicService) { /* * 获取二手房详情 * */ function getSecondHomesDetail(__scope__,params){ params = params || {}; var myurl = WAP_CONFIG.path + "/Estate/homesDetail.html"; var defaultParams = { id:1 }; defaultParams = $.extend(defaultParams,params) var promise = ApiService.post(myurl,defaultParams); promise.then(function(responseData){ if(responseData.status == 1){ __scope__.goodDetails = responseData.data; } }); } //返回service的功能 return { "getSecondHomesDetail":getSecondHomesDetail }; }]);
/** * 定义ApiService服务 * 功能:专门向服务器发送post 和 get请求 * */ angular.module('houseApp') .factory('ApiService', ["$window", "$http", "WAP_CONFIG", "$q", "$log",function($window, $http, WAP_CONFIG, $q, $log) { var _api = WAP_CONFIG; var endpoint = _api.host + ':' + _api.port; // public api return { //发送服务器的域名+端口,例如http://deve.sqhzg.cn:80 endpoint: endpoint, //post请求,第一个参数是URL,第二个参数是向服务器发送的参数(JSON对象), post: function(url, data) { url = endpoint + url; var deferred = $q.defer(); var tempPromise; //判断用户是否传递了参数,如果有参数需要传递参数 if(data != null && data != undefined && data != ""){ tempPromise = $http.post(url,data); }else{ tempPromise = $http.post(url); } tempPromise.success(function(data,header,config,status) { deferred.resolve(data); }).error(function(msg, code) { deferred.reject(msg); $log.error(msg, code); }); return deferred.promise; }, //get请求,第一个参数是URL,第二个参数是向服务器发送的参数(JSON对象), get: function(url, data) { url = endpoint + url; var deferred = $q.defer(); var tempPromise; //判断用户是否传递了参数,如果有参数需要传递参数 if(data != null && data != undefined && data != ""){ tempPromise = $http.get(url,data); }else{ tempPromise = $http.get(url); } tempPromise.success(function(data,header,config,status) { deferred.resolve(data); }).error(function(msg, code) { deferred.reject(msg); $log.error(msg, code); }); return deferred.promise; } }; }]);
/** * 定义常量WAP_CONFIG;WAP为当前子模块功能 * */ angular.module('houseApp') .constant('WAP_CONFIG', { host: 'http://localhost', //host: 'http://deve.sqhzg.cn', port: '63342', //port: 80, //path: '/index.php/Wap', //house为工程名,data为存放数据的目录 path: '/house/data', mainPage: '/house/index.html' });
如果想调试本地,值需要修改上述配置文件即可
备注:
data目录下面的html文件中的数据(JSON格式),一定要求json中的key用引号包裹,否则浏览器无法识别,ajax会认为发送请求不成功。
相关推荐
颤抖吧腿子 2020-09-04
xxuncle 2020-06-05
QiaoranC 2020-09-25
liduote 2020-06-16
阿斌Elements 2020-06-11
ChinaGuanq 2020-06-05
wanghongsha 2020-03-26
csm0 2020-03-05
shyoushine 2020-02-25
electronvolt 2020-02-12
jsonwoo 2020-01-20
ZadarrienChina 2020-01-07
wwwxuewen 2020-01-04
dynsxyc 2020-01-03
liangjielaoshi 2019-12-27
bowean 2019-12-27
wwwxuewen 2019-12-25
liwusen 2019-12-16
颤抖吧腿子 2019-12-16