javascript - 使用循环计算数组中新推送的数据

Question

我在正确计算循环内数组中的数值时遇到问题。

场景

• tbody 生成一个动态值列表。
• td 中的 button 有一个名为 preBookThis() 的 function 和 params.
• 当用户点击按钮时，它会触发函数，然后将数据推送到一个数组变量.
• 在推送 后，将有一个for 循环 来迭代和计算值。 ($scope.nights 是两个日期 - 即 2018-05-05 和 2018-05-07，因此它的值为 2)

问题

• 假设 tbody 中有三行，并且具有以下值。

  $scope.nights = 2; 第 1 行 = 100； 行 2 = 200； row3 = 300;

• 当用户点击第 1 行中的按钮时，计算会按预期进行并执行

  amount_row1 = 200;

但是……

• 当用户单击第 2 行中的按钮时，第一行的计算值将加倍。

  amount_row1 = 400; amount_row2 = 400;

还有……

• 当用户单击第 3 行中的按钮时，第一行和第二行的计算值将再次翻倍。

  amount_row1 = 800; 数量_行2 = 800； amount_row3 = 600;

最终输出应该是:

 amount_row1 = 200;
 amount_row2 = 400;
 amount_row3 = 600;

HTML

<tbody ng-repeat="room in roomsDisplay">
    <tr>
        <td>
            <div class="col-md-6"><img ng-src="images/rooms/{{room.room_image}}"></div>         
        </td>
        <td>
            <div style="margin-top: 20px;"><input type="button" 
                ng-click="preBookthis({room})" class="btn btn-primary" 
                value="Book this Room"></div>
        </td>
    </tr>
</tbody>

JS

$scope.preBookthis = function(data){
    $scope.totalAmount = 0;
    $scope.bookData.push({ 
        'room_name': data.room.room_name, 
        'price': data.room.price,
        'amount': $scope.amount,
        'id' : data.room.rooms_type_id
    });

    _.forEach($scope.bookData, function(value, key){
        value.amount = value.amount * $scope.nights;
    });
}

Answer 1

添加新对象时只计算一次，不要遍历所有其他已经计算过的对象

类似于:

$scope.preBookthis = function(data){
    $scope.totalAmount = 0;
    $scope.bookData.push({ 
        'room_name': data.room.room_name, 
        'price': data.room.price,
        'amount': $scope.amount * $scope.nights,// calculate only for this item
        'id' : data.room.rooms_type_id
    });  
}