Question

我是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>

有谁知道我在这里做错了什么？

Answer 1

温度是一个字符串，您需要将其转换为整数（DEMO）：

sum += parseInt($scope.items[i].temp, 10);

或者如果你想使用花车：

sum += parseFloat($scope.items[i].temp);

编辑值后，平均功能不返回正确的输出

1 个答案: