购物车——（查询，排序）

最新推荐文章于 2020-03-06 16:26:43 发布

Cf1035630950

最新推荐文章于 2020-03-06 16:26:43 发布

阅读量636

点赞数

本文链接：https://blog.csdn.net/Cf1035630950/article/details/78816110

版权

<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/angular.js"></script>
<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.goods = [{
num: 80,
name: "iphone",
price: 5000
}, {
num: 1200,
name: "ipad mini",
price: 2200
}, {
num: 500,
name: "ipad air",
price: 2340
}, {
num: 29,
name: "ipad",
price: 1420
}, {
num: 910,
name: "imac",
price: 6000
}];
$scope.dele = function(name) {
if(window.confirm("确定要删除" + name + "吗？")) {
for(index in $scope.goods) {
if(name == $scope.goods[index].name) {
$scope.goods.splice(index, 1);
}
}
}
}
$scope.sel = "请选择";
$scope.isPrice = function(price) {
var priceArr = $scope.sel.split("-");
var priceMin = priceArr[0];
var priceMax = priceArr[1];
if($scope.sel == "请选择") {
return true;

} else {
if(isNaN(priceMax)) {
if(price >= priceMin) {
return true;
} else {
return false;
}
} else {
if(price >= priceMin && price <= priceMax) {

return true;
} else {
return false;
}
}
}
}
$scope.flag = "";
$scope.orderColumn = "id";
$scope.order = function(column) {

$scope.orderColumn = column;
if($scope.flag == "") {
$scope.flag = "-";
} else {
$scope.flag = "";
}
}
});
</script>
</head>

<body ng-app="myApp" ng-controller="myCtrl">
<input type="text" placeholder="请输入商品" ng-model="select" />
<select ng-model="sel">
<option>请选择</option>
<option>0-2000</option>
<option>2001-3000</option>
<option> 3001-4000</option>
<option> 4001-5000</option>
<option> 5001-6000</option>
<option> 6001-无限大</option>
</select>
<table border="1" cellpadding="10" cellspacing="0">
<tr>
<th ng-click="order('num')">商品编号</th>
<th ng-click="order('name')">商品名称</th>
<th ng-click="order('price')">商品价格</th>
<th>操作</th>
</tr>
<tr ng-repeat="g in goods | filter:{name:select} | orderBy:flag+orderColumn" ng-show="isPrice(g.price)">
<td>{{g.num}}</td>
<td>{{g.name}}</td>
<td>{{g.price}}</td>
<td><input type="button" value="删除" ng-click="dele(g.name)" /></td>
</tr>
</table>
</body>

</html>

Cf1035630950

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
购物车——（查询，排序）

var app = angular.module("myApp", []);app.controller("myCtrl", function($scope) {$scope.goods = [{num: 80,name: "iphone",price: 5000}, {num: 1200,name: "ipad mini",price: 2200}, {
复制链接

扫一扫