AngularJS进阶(二十七)实现二维码信息的集成思路_angular 实现二维码分享获取个人信息功能

思路

获取的内容数据如下:

现在可以获取到第一级数据，第二级数据data获取不到。利用第一级数据的获取方法获取不到第二级数据。

for(i in data){
alert(i);           //获得属性 
if(typeof(data[i]) == "object"){
var tmp = data[i];
for(j in tmp){
alert(tmp[j]);
}
}else{
alert(data[i]);  //获得属性值
}
}

经过层层解析，获取到的数据结构如下所示:

经过进一步的优化改进，获取到的数据详情如下所示:

接下来面临的问题就是:如何实现两个html页面间传值？通过搜索,不同页面之间的传值方法有:1.地址传值(get)  2.cookie  3.localstorage  4.sessionStorage  5.flash  6.依赖后端服务器。根据不同场景和需求选择不同方案。

经过自己的多次尝试，终于在localstorage这条路上走通了。

但是在二维码显示的环节上遇到了问题，太大(见下图左)的话影响布局，太小(见下图右)的话二维码无法解析。

                         

自己必须找到一个折中的办法，看来得重新布局一下了，原始布局如下所示:

改善的页面布局如下：

核心代码

js

var tmp;
var medInfo = "{";
for(i in data){
//alert(i);           // 获得属性 
var trans;
//  对获取信息进行筛选
if(typeof(i) != "undefined" && i != "stat" && i != "merch_uid" && i != "result" && i != "errtext") {
switch (i) {
    case "tx_time":
    	trans = "交易时间";
        break;
    case "buy_uid":
    	trans = "购药者帐号";
        break;
    case "buy_addr":
    	trans = "收货地址";
        break;
    case "receiver":
    	trans = "收货人";
        break;
    case "receiver_tel":
    	trans = "收货人电话";
        break;
    case "old_amt":
    	trans = "药品总价";
        break;
    case "amt":
    	trans = "支付金额";
        break;
    case "merch_name":
    	trans = "配送药店";
        break;
    case "msg":
    	trans = "客户留言";
        break;
    case "cnt":
    	trans = "药品种类";
        break;
    case "data":
    	trans = "药品列表";
        break;
    default:
}
medInfo += "\"" + trans + "\":";
if(typeof(data[i]) == "object"){
tmp = data[i];
//alert("这是一个object对象");
}else{
//alert(data[i]);  // 获得属性值
medInfo += "\"" + data[i] + "\",\n";
}
}
}
//alert(tmp.length);
tag = 1;
// 获取二级数据(购物车内容)
for(k = 0; k < tmp.length; k++){
zqy = tmp[k];
for(j in zqy){
//alert(j);
var trans;
//  对获取信息进行筛选
switch (j) {
  case "medcnt":
  	trans = "药品数量";
     break;
  case "medamt":
  	trans = "金额总计";
    break;
  case "medname":
   	trans = "药品名称";
    break;
  case "medprice":
   	trans = "药品价格";
    break;
   case "medid":
   	trans = "药品ID";
    break;
   default:
       
}
if(tag == 1){
medInfo += "\n[\"" + trans + "\":";
tag = 2;


**对象篇**

![](https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy82MTY4MzU2LWIxMTdmNzMyNDJlZjAyMDM?x-oss-process=image/format,png)

![](https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy82MTY4MzU2LWU5ZGY5NGRhODZhZGZjNjY?x-oss-process=image/format,png)

**模块化编程-自研模块加载器**



![](https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy82MTY4MzU2LWUyNWEzOGRhNTU1NTBmOGY?x-oss-process=image/format,png)



![](https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy82MTY4MzU2LTQ5MGM2MTlhOTI5YjY3Y2U?x-oss-process=image/format,png)