上周三代码

最新推荐文章于 2024-05-27 09:46:06 发布

mzr777

最新推荐文章于 2024-05-27 09:46:06 发布

阅读量164

点赞数

分类专栏：周考

本文链接：https://blog.csdn.net/mzr777/article/details/78318336

版权

周考专栏收录该内容

9 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<style>
			button{background-color: darkorange; color: azure;}
		</style>
		<script type="text/javascript" src="js/angular.js"></script>
		<script>
			var app=angular.module("myApp",[]);
			$scope="Name";
			$scope.desc=0;
			app.controller("myCtrl",function($scope){
				$scope.shuzu=[
					{
						"Bianhao":1234,
						"Name":"ipad",
						"Price":"￥：3.400.00",
						"Kucun":10
					},
					{
						"Bianhao":1244,
						"Name":"aphone",
						"Price":"￥：6.400.00",
						"Kucun":100
					},
					{
						"Bianhao":1334,
						"Name":"mypad",
						"Price":"￥：4.400.00",
						"Kucun":20
					},
					{
						"Bianhao":8234,
						"Name":"zpad",
						"Price":"￥：8.400.00",
						"Kucun":130
					}
				];
				$scope.delete=function($index){
					if($index>=0){
						if(confirm("是否删除此商品")){
							$scope.shuzu.splice($index,1);
						}
					}
				};
				$scope.delete1=function($index){
					if($scope.shuzu.length>=0){
						if(confirm("是否全部删除商品")){
							$scope.shuzu.splice($index);
						}
					}
				};
				var isAllSeclected=true;
				$scope.checkAll=function(){
					for(var i=0;i<$scope.list.length;i++){
						if(isAllSeclected){
							$scope.list[i].chk=true;
						}else{
							$scope.list[i].chk=false;
						}
					}
					isAllSeclected!=isAllSeclected;
				}
			});
		</script>
		<title></title>
	</head>
	<body ng-app="myApp">
		<table ng-controller="myCtrl" border="1" cellspacing="0" cellpadding="0" align="center">
			<tr>
				<td colspan="6" align="center"><input type="text" ng-model="query"/><button ng-click="delete1($index)">批量删除</button></td>
			</tr>
			<tr>
				<th><input type="checkbox" ng-model="all" ng-click="checkAll()"></th>
				<th ng-click="col='Bianhao';desc!=desc">商品编号</th>
				<th ng-click="col='Name';desc!=desc">商品名称</th>
				<th ng-click="col='Price';desc!=desc">商品价格</th>
				<th ng-click="col='Kucun';desc!=desc">商品库存</th>
				<th>删除操作</th>
			</tr>
			<tr ng-repeat="x in shuzu|orderBy:col:desc|filter:query">
				<td><input type="checkbox" name="chk" ng-model="item.chk" ng-checked="all">  </td>
				<td>{{x.Bianhao}}</td>
				<td>{{x.Name}}</td>
				<td>{{x.Price}}</td>
				<td>{{x.Kucun}}</td>
				<td><button ng-click="delete($index)">删除</button></td>
			</tr>
		</table>
	</body>
</html>

mzr777

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
上周三代码

button{background-color: darkorange; color: azure;} var app=angular.module("myApp",[]); $scope="Name"; $scope.desc=0; app.controller("myCtrl",function($scope){ $scope.shuzu=[
复制链接

扫一扫