我是AngularJS的新手,但我有一个小问题。我有一个要计算平均温度的城市列表,由于某种原因,在编辑了城市列表中的温度值后,计算平均温度的函数返回了不正确的值。加载页面后,它返回正确的值,但是在编辑温度值后,我得到了错误的结果。
这是我的代码:
<html ng-app>
<head>
<title>Weather Comparison</title>
</head>
<body ng-controller='WeatherController'>
<h1>Weather Comparison</h1>
<div ng-repeat='item in items'>
<span>{{item.city}}</span>
<input ng-model='item.temp'>
<input ng-model='item.humidity'>
<input ng-model='item.wind'>
<input ng-model='item.cloudiness'>
</div>
<div>The average temperature is {{avgTemp}}</div>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
<script>
function WeatherController($scope) {
$scope.items = [
{city: 'Phoenix,AZ', temp: 38, humidity: 10, wind: 3, cloudiness: 10},
{city: 'Atlanta,GA', temp: 30, humidity: 80, wind: 7, cloudiness: 40},
{city: 'Honolulu,HI', temp: 32, humidity: 75, wind: 8, cloudiness: 30}
];
//returns incorrect average values after editing default temperature values
$scope.$watch(function() {
var sum = 0;
for (var i = 0; i < $scope.items.length; i++) {
sum += $scope.items[i].temp;
}
$scope.avgTemp = sum / $scope.items.length;
});
}
</script>
</body>
</html>
有人知道我在这里做错什么吗?
最佳答案
温度是一个字符串,您需要将其转换为整数(DEMO):
sum += parseInt($scope.items[i].temp, 10);
或者,如果您想使用浮点数:
sum += parseFloat($scope.items[i].temp);