angular删除数据+数量计算+价钱计算
来源:互联网 发布:域名国外申请做跳转 编辑:程序博客网 时间:2024/06/08 15:18
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="angular-1.3.0.js"></script>
<script>
var myapp=angular.module("myapp",[]);
var data=[
{
done:false,
name:"小米",
price:666,
count:2,
},
{
done:false,
name:"华为",
price:888,
count:1,
},
{
done:false,
name:"苹果",
price:299,
count:5,
},
{
done:false,
name:"小辣椒",
price:555,
count:1,
},
{
done:false,
name:"坚果",
price:1999,
count:5,
}
]
myapp.controller("myCtrl",function ($scope) {
$scope.data=data;
$scope.num=0;
//实际付款
$scope.money=function () {
$scope.numsn=0;
if( $scope.num>9999)
{
$scope.numsn=$scope.num;
}
else
{
if($scope.numsn!=0)
{
$scope.numsn=$scope.num+10;
}
}
return $scope.numsn;
}
//判断是否包邮
$scope.baoyou=function () {
$scope.nums="";
if( $scope.num>9999)
{
$scope.nums="包邮";
}
else
{
$scope.nums="十元";
}
return $scope.nums;
}
//商品总价
$scope.counts=function () {
$scope.num=0;
$scope.n=0;
for(var i=0;i<$scope.data.length;i++)
{
if($scope.data[i].done==true)
{
$scope.num+=$scope.data[i].price*$scope.data[i].count;
$scope.n++;
}
}
/* if($scope.n==$scope.data.length)
{
$scope.chec=true;
}*/
}
/*删除*/
$scope.del=function (name) {
for(var i=0;i<$scope.data.length;i++) {
if($scope.data[i].name==name)
{
$scope.data.splice(i,1);
}
}
}
//删除选中的
$scope.delall=function () {
for(var i=0;i<$scope.data.length;i++)
{
if($scope.data[i].done==true)
{
$scope.data.splice(i,1);
i--;
}
}
}
//小计
$scope.xj=function (a,b) {
$scope.nums=a*$scope.data[b].price;
$scope.counts();
return $scope.nums;
}
//点击全选
$scope.checkAll=function () {
for(var i=0;i<$scope.data.length;i++)
{
if($scope.chec==true)
{
$scope.data[i].done=true;
}
else{
$scope.data[i].done=false;
}
}
$scope.num=0;
for(var i=0;i<$scope.data.length;i++)
{
if($scope.data[i].done==true)
{
$scope.num+=$scope.data[i].price*$scope.data[i].count;
}
}
}
})
</script>
</head>
<body ng-app="myapp" ng-controller="myCtrl">
<button ng-click="delall()">删除选中的</button>
<table border="1" bordercolor="#000000" width="500" cellpadding="0" cellspacing="0">
<thead>
<tr>
<th>全选<span><input type="checkbox" ng-click="checkAll()" ng-model="chec"></span></th>
<th>商品名称</th>
<th>单价</th>
<th>购买数量</th>
<th>小计</th>
<th> </th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in data">
<td><input type="checkbox" ng-model="item.done" ng-click="counts()"></td>
<td>{{item.name}}</td>
<td>{{item.price}}</td>
<td><input type="number" ng-model="item.count"></td>
<td>{{xj(item.count,$index)|currency:"RMB"}}</td>
<td><button ng-click="del(item.name)">删除</button></td>
</tr>
</tbody>
</table>
<div>商品总价:<span>{{num}}</span></div>
<div>邮费:<span>{{baoyou()}}</span></div>
<div>实际付款:<span>{{money()}}</span></div>
</body>
</html>
阅读全文
0 0
- angular删除数据+数量计算+价钱计算
- 计算价钱
- 购物车点击管理删除和商品价钱的计算
- 股神——计算价钱
- Android_二级列表购物车之增删改查,全选反选,加减器,价钱数量计算
- Android_二级列表购物车之增删改查,全选反选,加减器,价钱数量计算
- angular+做一个购物车可以删除,计算总额
- 计算WorkSheet数量
- 计算三角形的数量
- 计算总的行数/数量
- 计算耗子数量
- 计算单词数量
- MVVM KVO 购物车 (一处计算总价钱)
- Angular.js用法(二):购物车数量加减及总价计算
- HTML angular购物车:加减按钮改变数量+全选+低于1时提示删除商品+计算所有商品总价+清空购物车+单独删除+输入内容小于1时,自动变为1+反选
- 计算列的合计数量
- Slab对象数量计算函数
- linux命令-- 计算文件数量
- 去除inline-block元素间间距的方法
- Error creating bean with name 'org.springframework.context.annotation.internalAsyncAnnotationProcess
- fileinputstream
- UVa11374 Airport Express
- 简单C语言线程池的编写
- angular删除数据+数量计算+价钱计算
- css盒子模型常用属性
- Linux 定时任务
- 《大话设计模式》读书笔记之C++实现--chapter27解释器模式
- AngularJS 中 CheckBox的简单案例
- Activiti工作流学习总结(二)
- cas单点登入原理
- bzoj 1566: [NOI2009]管道取珠 动态规划
- 【CF633D】Fibonacci-ish