JS代码:
var url = "https://testweixin.1jia2.cn/api/weixin/1jia2_online/script/weixin_order_list.php";
var app = angular.module("myApp", []);
app.controller("customersCtrl", function ($scope, $http) {
$http.get(url).success(function (data) {
// 通过
分隔
data = data.split("
");
// 要显示的数据
var length = data.length - 1;
var array = [];
for (var i = 1; i < length; i++) {
// result[1] result[2] result[3] result[4] result[5] result[6] result[7] result[8]
// 订单号 ---------------日期------------------ --商品-- --详情-- 单价 个数 总价 详情
var result = data[i].match(/(.{32})\s+(\d{4}-\d{2}-\d{2}\s\d{2}:\d{2}:\d{2})\s+([\d\D]*)\s+([\d\D]*)\s+(\d+)\s+(\d+)\s+(\d+)\s+([\d\D]+)/);
for (var j = 1; j < result.length; j++) {
// 用户的信息 特殊处理
if (j == result.length - 1) {
//无数据用户
if (result[j].length < 6) {
result[j] = "";
}
else {
//有数据用户
result[j] = result[j].replace(/\\/g, "");
result[j] = result[j].substring(1, result[j].length - 3);
var obj = angular.fromJson(result[j]);
result[8] = obj;
}
}
}
array.push({
'number': result[1],
'time': result[2],
'goods': result[3],
'details': result[4],
'price': result[5],
'amount': result[6],
'total': result[7],
'person': result[8]
});
}
$scope.customers = array;
});
});
HTML代码:
<!DOCTYPE html>
序号 | 订单号 | 购买时间 | 购买商品 | 商品详情 | 单价 | 个数 | 总价 | 个人信息 |
{{ $index + 1 }} | {{customer.number}} | {{customer.time}} | {{customer.goods}} | {{customer.details}} | {{customer.price}} | {{customer.amount}} | {{customer.total | number:2}} | Name:{{customer.person.userName}} Mobile:{{customer.person.userMobile}} 详情 |
总计 | 总数: | 总价: |
CSS代码:
*{
margin: 0;
padding: 0;
}
.all {
position: relative;
}
.logo {
width:165px;
height: 135px;
position: absolute;
background-image: url("logo.png");
left: 250px;
top:0px;
z-index: 1;
}
.msg {
position: absolute;
font-family: "微软雅黑";
font-size: 50px;
left:600px;
top: 30px;
}
.tab {
position: absolute;
border: 1px solid red;
background-color:#cccccc;
width: 100%;
height: 1000px;
top:120px;
z-index: 10;
}
#table {
border:1px solid #000;
position: absolute;
margin: 40px auto;
border-collapse:collapse;
width:95%;
left:60px;
top: 30px;
z-index: 2;
}
.tab td{
border:1px solid #000;
}
#number,#time,#id,#sum {
text-align: center;
}
#price,#amount,#total,#no,#money{
text-align: right;
}
.word {
font-family: "微软雅黑";
font-size: 18px;
color:blue;
text-align: center;
}
#tableTwo {
/*border:1px solid #000;*/
border-collapse: collapse;
width:100%;
}
就是我点击详情的时候,能够alert出来当前的个人信息。用angularJS做。急急急啊,大神们,求指导~~~~
利用angular的特性:双向绑定
你的代码可能是粘贴的原因,显得有点乱,看的不是很清除。你的需求:从后端获得数据,并且通过弹出框显示出来?
如果是这样我可以提供一个实现流程:
1、$http.get()获得数据并保存到Controller的一个对象中 如:$scope.mArray={};
2、使用$modal自定义弹出框,具体怎么实现可以上网找,同时需要用到bootstrap
3、将$scope.mArray={}中的数据与自定义的$modal弹出框绑定,ng-bind=""
这样基本就能满足你的需求了,希望对你在解决问题的思路上有帮助