排序
来源：互联网 发布：淘宝视频尺寸怎么修改 编辑：程序博客网 时间：2024/06/05 17:49
<!DOCTYPE html><html><head><meta charset="utf-8" /><title></title><style type="text/css">#a {border-collapse: collapse;text-align: center;width: 800px;margin-top: 20px;}#but {margin-left: 30px;background: #99FF00;border-radius: 5px;}table tr:nth-child(odd) {background-color: #999999;}table tr:nth-child(even) {background-color: #EEEEEE;}</style><script src="js/jquery-2.1.0.js"></script><script src="js/angular.min.js"></script><script>21angular.module("jml", []).controller("democ", function($scope) {var date = new Date();$scope.datas = [{name: "云南白药",num: 100,address: "云南",price: 19.9,time: date},{name: "999感冒灵",num: 30,address: "北京",price: 12.5,time: date},{name: "感康",num: 20,address: "河北",price: 16.6,time: date}];//删除$scope.del = function(a) {if(window.confirm("确定要删除用户吗？")) {$scope.datas.splice(a, 1);alert("删除成功");}}//隐藏显示$scope.isShow = false;$scope.btn = function() {if($scope.isShow) {$scope.isShow = false;} else {$scope.isShow = true;}}//添加$scope.baocun = function() {var name = $scope.name;var num = $scope.num;var address = $scope.address;var price = $scope.price;$scope.datas.push({name: name,num: num,address: address,price: price,time: new Date()});}})</script></head><body ng-app="jml" ng-controller="democ"><center><h1>商品库存管理系统</h1><hr style="margin-bottom: 20px;" /><input type="text" style="border-radius: 8px;" ng-model="selname" placeholder="请输入查找的商品名称" /><select ng-model="aa" style="margin-left: 400px;"><option value="+num">按货物数量正序排列</option><option value="-num">按货物数量倒叙排列</option></select><button id="but" ng-click="btn()">入库</button><table border="1" id="a"><tr><td>货物名称</td><td>货物数量</td><td>货物产地</td><td>货物单价</td><td>货物入库日期</td><td>操作</td></tr><tr ng-repeat="d in datas|filter:{name:selname}|orderBy:aa"><td>{{d.name}}</td><td>{{d.num}}</td><td>{{d.address}}</td><td>{{d.price | currency:"¥:"}}</td><td>{{d.time| date:"yyyy-MM-dd HH:mm:ss"}}</td><td><input type="button" value="删除" ng-click="del($index)" /></td></tr></table><table border="0" ng-show="isShow"><tr><td>货物名称</td><td><input type="text" ng-model="name" /></td></tr><tr><td>货物数量</td><td><input type="text" ng-model="num" /></td></tr><tr><td>货物产地</td><td><input type="text" ng-model="address" /></td></tr><tr><td>货物单价</td><td><input type="text" ng-model="price" /></td></tr><tr><td></td><td><input type="button" value="入库" ng-click="baocun()" /></td><td></td></tr></table></center></body></html>
