<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
th,td{
padding: 10px;
border: 1px solid #000000;
}
table{
border-collapse: collapse;
}
</style>
<script src="angular-1.3.0.js"></script>
<script>
var myapp = angular.module("myapp",[]);
myapp.controller("myCtrl",function ($scope) {
$scope.data = [{
name:"zs",
price:"1200",
number:2,
sum:2400,
check:false
},{
name:"qq",
price:"1200",
number:2,
sum:2400,
check:false
},{
name:"ee",
price:"1200",
number:2,
sum:2400,
check:false
},{
name:"ww",
price:"1200",
number:2,
sum:2400,
check:false
}];
//减小
$scope.min = function (index) {
$scope.data[index].number--;
}
//增加
$scope.add = function (index) {
$scope.data[index].number++;
}
//删除
$scope.del = function(index){
if($scope.data[index].check==true){
if(confirm("确定删除吗？")){
$scope.data.splice(index,1)
}
}
}
//应付金额
$scope.count = function () {
var aaa = 0;
for(var i = 0;i<$scope.data.length;i++){
aaa+= $scope.data[i].price*$scope.data[i].number
}
return aaa;
}
//邮费
$scope.$watch("count()",function (newvalue) {
if(newvalue<=10000){
$scope.yf = 10;
}else{
$scope.yf= 0
}
})
$scope.checkAll = false;
//全选
$scope.checkedAll = function () {
if($scope.checkAll==true){
for(var i = 0;i<$scope.data.length;i++){
$scope.data[i].check=true;
}
}else{
for(var i = 0;i<$scope.data.length;i++){
$scope.data[i].check=false;
}
}
}
var n = 0;
//反选
$scope.addCheck = function (index) {
if($scope.data[index].check = true){
n++;
}else{
n--;
}
if(n==$scope.data.length){
$scope.checkAll = true;
}else{
$scope.checkAll = false;
}
}
});
</script>
</head>
<body ng-app="myapp" ng-controller="myCtrl">
<h1>我的购物车</h1>
<button style="float: right">清空购物车</button>
<table>
<thead>
<tr>
<td><input type="checkbox" ng-model="checkAll"ng-click="checkedAll()"></td>
<td>name</td>
<td>price</td>
<td>number</td>
<td>sum</td>
<td>option</td>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in data">
<td><input type="checkbox" ng-model="item.check" ng-click="addCheck($index)" ></td>
<td>{{item.name}}</td>
<td>{{item.price}}</td>
<td><span ng-click="min($index)">-</span><input type="text" ng-model="item.number"><span ng-click="add($index)">+</span></td>
<td>{{item.price*item.number}}</td>
<td><button ng-click="del($index)">删除</button></td>
</tr>
</tbody>
</table>
<p>应付金额<a>{{count()}}</a></p>
<p>邮费<a>{{yf}}</a></p>
<p>实付金额<a>{{count()+yf}}</a></p>
</body>
</html>
