完整购物

最新推荐文章于 2022-06-30 15:58:06 发布

V563626266

最新推荐文章于 2022-06-30 15:58:06 发布

阅读量269

点赞数

分类专栏：代码文章标签：购物

本文链接：https://blog.csdn.net/VS563626266/article/details/79726849

版权

代码专栏收录该内容

6 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/angular.min.js"></script>
<script>
var app= angular.module("gaoynapp",[]); //gaoynapp，在视图中指明angular的作用范围
app.controller("ctrl",function($scope,$http){ //控制器ctrl：数据的定义和数据的增删改查操作都是写在控制器
//从网站获取数据
$scope.stus=[];

$http.get("http://result.eolinker.com/lKgJQ8Zec38423e5603b8e055d1193a8127c0c060bb1b55?uri=test1")
.success(function(aa){ //访问网站的数据成功后，网頁上的数据内容---赋值给函数的变量aa
$scope.stus=aa; //把从网站上获取的数据赋值给数组stus
})

//定义修改的方法
$scope.update=function(info){ //函数中或获得修改按钮对应对象
//弹框
var aa= prompt("请修改评分",info.score); //在框中显示的默认值---》可以被修改---》修改后的值--》aa接受修改后的值
//判断是否点击了确定按钮
if(aa!=undefined){
info.score=aa; //把弹出框新的添加的值---》赋值给修改按钮对应对象
}

}

//定义删除方法
$scope.del=function(name){
for(var i=0;i<$scope.stus.length;i++){
//每次都判断当前对象的名字，是否是领导指定的名字
if($scope.stus[i].name==name){
//把当前位置的对象进行删除
$scope.stus.splice(i,1);
}
}
}

//全选和全不选

$scope.ckall=function(){
//获取领导的当前状态
var gf_flag=$scope.flag;
//想要让视图上所有的复选框处于选中或者不选中---》改变数据源
for(var i=0;i<$scope.stus.length;i++){
$scope.stus[i].ck=gf_flag;//ck--->数组中每个对象的ck

}
}

//批量删除的方法
$scope.delall=function(){
//对象的标记状态ck状态值true
for(var i=0;i<$scope.stus.length;i++){
//视图复选框是否被勾选
if($scope.stus[i].ck==true){
$scope.stus.splice(i,1);
//保证连续删除
i--;
}
}
}

})
</script>
</head>
<body ng-app="gaoynapp" ng-controller="ctrl" >

<input ng-model="sname" placeholder="请输入查询到电影名称" /> <button ng-click="bname=sname">查询</button> 
<select ng-model="px">
<option value="">请选择。。。</option>
<option value="time">根据时长升序排列</option>
<option value="-time">根据时长降序排列</option>
<option value="price">根据售价升序排列</option>
<option value="-price">根据售价降序排列</option>

</select>
<button ng-click="delall()">批量删除</button>
<table border="1px">
<tr>
<th><input type="checkbox" ng-click="ckall()" ng-model="flag" /></th>
<td>电影名称</td>
<td>类别</td>
<td>时常</td>
<td>导演</td>
<td>售价</td>
<td>上映时间</td>
<td>评分</td>
<td>操作</td>
</tr>

<tr ng-repeat="gyninfo in stus|orderBy:px|filter:{name:bname}"> 
<td><input type="checkbox" ng-model="gyninfo.ck" /></td>
<td>{{gyninfo.name}}</td>
<td>{{gyninfo.type[0]}},{{gyninfo.type[1]}}</td> 
<td>{{gyninfo.time}}</td>
<td>{{gyninfo.author}}</td>
<td>{{gyninfo.price|currency:"￥:"}}</td>
<td>{{gyninfo.playTime|date:'yyyy-MM-dd HH:mm:ss'}}</td>
<td>{{gyninfo.score}}</td>
<td><button ng-click="update(gyninfo)">修改</button><button ng-click="del(gyninfo.name)">删除</button> </td>
</tr>
</table>
</body>
</html>