Question

我是angularjs的新手。以下代码有什么问题？它没有正确计算所有购物商品的总价！：（

我创建了一个包含＆＃34; name＆＃34;，＆＃34; price＆＃34;并且＆＃34;被选中＆＃34;。已正确显示已检查项目的总数。但是，它没有正确计算其价格总和。我尝试过使用parseInt但它似乎也没有帮助。

<!DOCTYPE html>
<html>
<head><script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
    </head>
<body ng-app="myApp" ng-controller="myCtrl">
<h1>Select item(s) and add to cart:</h1>
<div ng-repeat="item in items">
<label>
<input type="checkbox" ng-model="item.isSelected"></input>
<span>{{item.name}}</span>
<span>{{item.price}}</span>
</label>
</div>
<hr>
<p>Add items to shop</p>
Enter name: <input type="text" ng-model="newItemname" />
Enter price: <input type="text" ng-model="newItemprice" />
<button ng-click="addtoshop()">Add to shop</button>
<hr>
<h1>Add items to shopping cart</h1>
<button ng-click="addtocart((items | filter : { isSelected:true }))">Shop!</button>
<hr>
<p ng-model="amount">{{amount}}</p>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope){
$scope.items = [
{name:"Bread", price: 20, isSelected: false},
{name:"Butter", price: 25, isSelected: false},
{name:"Jam", price: 30, isSelected: false},
];
$scope.addtoshop = function(){
var newitem = {};
newitem.name =$scope.newItemname;
newitem.price=$scope.newItemprice; 
$scope.items.push(newitem);
}

$scope.addtocart = function(index){
alert("You chose " + index.length + " items.");
var p=0, i;
for(i=0;i<index.length;i++){
p += parseInt($scope.items[i].price);
}
alert("Shopping price: " + p);
$scope.amount = p;
};
});
</script>
</body>
</html>

Answer 1

这是因为您在addtocart方法的迭代中混合了2个集合。

这是一个修复

<!DOCTYPE html>
<html>
<head><script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
    </head>
<body ng-app="myApp" ng-controller="myCtrl">
<h1>Select item(s) and add to cart:</h1>
<div ng-repeat="item in items">
<label>
<input type="checkbox" ng-model="item.isSelected"></input>
<span>{{item.name}}</span>
<span>{{item.price}}</span>
</label>
</div>
<hr>
<p>Add items to shop</p>
Enter name: <input type="text" ng-model="newItemname" />
Enter price: <input type="text" ng-model="newItemprice" />
<button ng-click="addtoshop()">Add to shop</button>
<hr>
<h1>Add items to shopping cart</h1>
<button ng-click="addtocart((items | filter : { isSelected:true }))">Shop!</button>
<hr>
<p ng-model="amount">{{amount}}</p>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope){
$scope.items = [
{name:"Bread", price: 20, isSelected: false},
{name:"Butter", price: 25, isSelected: false},
{name:"Jam", price: 30, isSelected: false},
];
$scope.addtoshop = function(){
var newitem = {};
newitem.name =$scope.newItemname;
newitem.price=$scope.newItemprice; 
$scope.items.push(newitem);
}

$scope.addtocart = function(cartItems){
alert("You chose " + cartItems.length + " items.");
var p=0, i;
for(i=0;i<cartItems.length;i++){
p += parseInt(cartItems[i].price);
}
alert("Shopping price: " + p);
$scope.amount = p;
};
});
</script>
</body>
</html>

Angularjs：如何计算数组中所选项目的总价？

1 个答案: