<!DOCTYPE html>
<html> <head> <meta charset="UTF-8"> <title></title> <script src="../js/angular.min.js" type="text/javascript" charset="utf-8"></script> </head> <script type="text/javascript"> var app=angular.module("myapp",[]).controller("myctrl",function ($scope,$http) { $scope.arr=["--按要求排序--","电影时长正序","电影时长倒序","售价正序","售价倒序","上映时间正序","上映时间倒序","评分正序","评分倒序"]; $http.get("xinxi.json").then(function(success){ $scope.xinxi=success.data; }); $scope.change=function () { for (var i = 0; i < $scope.xinxi.length; i++) { $scope.xinxi[i].ck=$scope.checked; } } $scope.xg=function (i) { var a=prompt("评分修改",$scope.xinxi[i].score); $scope.xinxi[i].score=a; } $scope.sc=function (i) { if(confirm("您确定要删除该数据吗?")) { $scope.xinxi.splice(i,1); alert("删除成功!"); } } $scope.plsc=function () { for (var i = 0; i < $scope.xinxi.length; i++) { if($scope.xinxi[i].ck){ $scope.xinxi.splice(i,1); i--; } } } $scope.schange=function () { var yaoqiu=$scope.yaoqiu; switch (yaoqiu){ case "电影时长正序": $scope.xinxi.sort(function (a,b) { return a.time-b.time; }); break; case "电影时长倒序": $scope.xinxi.sort(function (a,b) { return b.time-a.time; }); break; case "售价正序": $scope.xinxi.sort(function (a,b) { return a.price-b.price; }); break; case "售价倒序": $scope.xinxi.sort(function (a,b) { return b.price-a.price; }); break; case "上映时间正序": $scope.xinxi.sort(function (a,b) { return a.playTime-b.playTime; }); break; case "上映时间倒序": $scope.xinxi.sort(function (a,b) { return b.playTime-a.playTime; }); break; case "评分正序": $scope.xinxi.sort(function (a,b) { return a.score-b.score; }); break; case "评分倒序": $scope.xinxi.sort(function (a,b) { return b.score-a.score; }); break; default: break; } } }); </script> <body ng-app="myapp" ng-controller="myctrl"> <input type="text" ng-model="queryName" placeholder="按电影名称模糊查询..."/> <button ng-click="query=queryName">搜索</button> <select ng-model="yaoqiu" ng-init="yaoqiu=arr[0]" ng-options="y for y in arr" ng-change="schange()">{{y}}</select> <button ng-click="plsc()">批量删除</button> <table border="1" cellspacing="0" cellpadding="0" width="80%"> <tr> <td> <input type="checkbox" ng-model="checked" ng-change="change()"/> </td> <td>电影名称</td> <td>类别</td> <td>时长</td> <td>导演</td> <td>售价</td> <td>上架时间</td> <td>评分</td> <td>操作</td> </tr> <tr ng-repeat="x in xinxi|filter:query"> <td> <input type="checkbox" ng-model="x.ck"/> </td> <td>{{x.name}}</td> <td>{{x.type[0]}},{{x.type[1]}}</td> <td>{{x.time}}分钟</td> <td>{{x.author}}</td> <td>{{x.price|currency:"¥:"}}</td> <td>{{x.playTime|date:"yyyy-MM-dd hh:mm:ss"}}</td> <td>{{x.score}}</td> <td> <button ng-click="xg($index)">修改</button> <button ng-click="sc($index)">删除</button> </td> </tr> </table> </body> </html>